NewReport.php
{
use Dispatchable, InteractsWithSockets, SerializesModels;
public function __construct(public string $message)
{
}
public function broadcastOn(): Channel
{
return new Channel('report');
}
}```
bootstrap.js
import Echo from 'laravel-echo';
import Pusher from 'pusher-js';
window.Pusher = Pusher;
window.Echo = new Echo({
broadcaster: 'pusher',
key: import.meta.env.VITE_PUSHER_APP_KEY,
wsHost: import.meta.env.VITE_PUSHER_HOST ?? ws-${import.meta.env.VITE_PUSHER_APP_CLUSTER}.pusher.com,
wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
enabledTransports: ['ws', 'wss'],
});
window.Echo.channel("report").listen("NewReport", (e) => {
console.log(e);
}); ```
.env
BROADCAST_DRIVER=pusher
QUEUE_CONNECTION=redis
REDIS_HOST=127.0.0.1
REDIS_PASSWORD=null
REDIS_PORT=6379
PUSHER_APP_KEY=app-key
PUSHER_APP_ID=app-id
PUSHER_APP_SECRET=app-secret
PUSHER_HOST=127.0.0.1
PUSHER_PORT=6001
PUSHER_SCHEME=http
PUSHER_APP_CLUSTER=mt1
The job is getting completed in laravel horizon.
"event": {
"message": "my report"
},
"tries": null,
"timeout": null,
"backoff": null,
"connection": null,
"queue": null,
"chainConnection": null,
"chainQueue": null,
"chainCatchCallbacks": null,
"delay": null,
"afterCommit": null,
"middleware": [
],
"chained": [
]
}```
This is my websocket output
```Connection id 668975084.84935881 sending message {"event":"pusher:connection_established","data":"{\"socket_id\":\"668975084.84935881\",\"activity_timeout\":30}"}
app-id: connection id 668975084.84935881 received message: {"event":"pusher:subscribe","data":{"auth":"","channel":"report"}}.
Connection id 668975084.84935881 sending message {"event":"```
When I use soketi server, everything works, I wonder why It wont work with websocket..