CODEWITHSUNDEEP
phplaravel-5.4pusherlaravel-echo
Kiren S
Kiren S

Reputation: 3097

Laravel Echo BroadcastException in PusherBroadcaster.php line 106: Unknown auth_key

I am getting Unknown auth_key error when trying to broadcast an event. I tried changing my cluster as mentioned in other posts but not working. I have uncommented broadcast service provider in app.php.

.env 

PUSHER_APP_ID=******
PUSHER_APP_KEY=******
PUSHER_APP_SECRET=******

config/broadcasting

 'pusher' => [
  'driver' => 'pusher',
  'key' => env('PUSHER_APP_KEY'),
  'secret' => env('PUSHER_APP_SECRET'),
  'app_id' => env('PUSHER_APP_ID'),
  'options' => [
   ],
],

\app\Events\MessagePosted.php

public function broadcastOn() {
  return new PresenceChannel('chatroom');
 }

\resources\assets\js\bootstrap.js

window.axios = require('axios');

window.axios.defaults.headers.common = {
    'X-Requested-With': 'XMLHttpRequest'
};

import Echo from "laravel-echo"
window.Pusher = require('pusher-js');
window.Echo = new Echo({
    broadcaster: 'pusher',
    key: '*****',
    cluster: 'ap2',
    encrypted: true
});

\resources\assets\js\app.js

const app = new Vue({
    el: '#app',
    data: {
        messages: [],
        usersInRoom: []
    },
    methods: {
        addMessage(message) {
            // Add to existing messages
            this.messages.push(message);

            // Persist to the database etc
            axios.post('/messages', message).then(response => {
                // Do whatever;
            })
        }
    },
    created() {
        axios.get('/messages').then(response => {
            this.messages = response.data;
        });
        Echo.join('chatroom')
                .here((users) => {
                    this.usersInRoom = users;
                })
                .joining((user) => {
                    this.usersInRoom.push(user);
                })
                .leaving((user) => {
                    this.usersInRoom = this.usersInRoom.filter(u => u != user)
                })
                .listen('MessagePosted', (e) => {
                    this.messages.push({
                        message: e.message.message,
                        user: e.user
                    });
                });
    }
});

Upvotes: 3

Views: 5089

Answers (1)

Seakleng Say
Seakleng Say

Reputation: 380

in config/broadcasting add 'cluster' => 'us2', 'encrypted' => true in 'options'

'pusher' => [
  'driver' => 'pusher',
  'key' => env('PUSHER_APP_KEY'),
  'secret' => env('PUSHER_APP_SECRET'),
  'app_id' => env('PUSHER_APP_ID'),
  'options' => [
       'cluster' => 'us2',
       'encrypted' => true
  ],
],

Upvotes: 5

Related Questions