I am trying to check new notification message and show it to realtime on "bell icon with count"
Everything works as expected in Localhost, but in server the layout file cannot receive data for further implementation
"pusher/pusher-php-server": "7.0.2",
"beyondcode/laravel-websockets": "^1.13",
Broadcasting configuration
'pusher' => [
'driver' => 'pusher',
'key' => env('PUSHER_APP_KEY'),
'secret' => env('PUSHER_APP_SECRET'),
'app_id' => env('PUSHER_APP_ID'),
'options' => [
'cluster' => env('PUSHER_APP_CLUSTER'),
'encrypted' => false,
'host' => '127.0.0.1', // in server host is different
'port' => 6001,
'scheme' => 'http'
],
'client_options' => [
// Guzzle client options: https://docs.guzzlephp.org/en/stable/request-options.html
],
],
Notification Class
public function via($notifiable)
{
return ['database', 'broadcast'];
}
public function toArray($notifiable)
{
return [
// this part is for storing notification data to 'DB'
];
}
public function toBroadcast($notifiable)
{
return new BroadcastMessage([]);
}
App Layout
window.onload=function(){
Echo.private('App.Models.User.{{ auth()->id() }}')
.notification((e) => {
console.log('ok');
// here bell icon and notification is refresh using (id).load()
});
};
bootstrap.js
window.Echo = new Echo({
broadcaster: 'pusher',
key: import.meta.env.VITE_PUSHER_APP_KEY,
wsHost: import.meta.env.VITE_PUSHER_HOST,
wsPort: 6001,
forceTLS: false,
disableStats: true,
cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER,
});
Data is stored in database, and when refresh the page we can see the latest data.
But when new notification class is called it does not show data to layout file means the console.log() cannot trigger. Any idea for this bug and thanks in advance.
ps: Works in localhost, but not on server..
