Laravel Echo 500 error not receiving pusher event - laravel

Question

i had a problem when using presence channel in Laravel Echo with pusher. when I fire an event, i get 500 error from BroadcastException without the response body which is hard for me to debug it. when i look to pusher debug console, the presence event was listened by pusher. so i assume my event has never been fired to Pusher. Here is the preview in my network tab
my controller:
public function store() {
$user = auth()->user();
$message = $user->messages()->create([
'message' => request('message')
]);
event(new MessageReceived($message, $user));
return ['status' => 'OK'];
}
the MessageReceived class
namespace App\Events;
class MessageReceived implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
public $message;
public $user;
/**
* Create a new event instance.
*
* #return void
*/
public function __construct(Message $message, User $user)
{
$this->message = $message;
$this->user = $user;
}
/**
* Get the channels the event should broadcast on.
*
* #return Channel|array
*/
public function broadcastOn()
{
return new PresenceChannel('chatroom');
}
}
and here is my vuejs
mounted() {
axios.get('/messages')
.then(response => {
this.messages = response.data
})
.catch(error => {
console.log(error)
})
Echo.join('chatroom')
.listen('MessageReceived', (e) => {
console.log(e) //never get into this
})
},
i can't find where the error is. i use cluster ap1 and is declared in broadcasting.php and in my bootstrap.js. anyone can help me out?

Answer 1

This can be caused by an error in your configuration. Here are some things to check:
In your .env file, make sure the pusher id, key, and secret are correctly set.
If you upgraded from Laravel 5.3 to Laravel 5.4, note that the .env variables PUSHER_KEY is now PUSHER_APP_KEY and PUSHER_SECRET is now PUSHER_APP_SECRET
In your config/broadcasting.php, make sure the cluster is set correctly.
If you are not in HTTPS, you may have to set the 'encrypted key to false
'options' => [
'cluster' => 'ap1', // change this to your app's cluster
'encrypted' => false,
],