Laravel echo connects to pusher instead of laravel-websockets

Question

I start laravel-websockets as a systemctl service.

Everything works but after I do a sudo reboot until the laravel-websockets process starts (I am using nginx as a reverse proxy too) the clients on the app are connecting to pusher instead of my socket service.

If I clear the cookies and refresh the page (a few minutes after the machine and all services started) the clients are connecting as they should to the laravel-websockets. But only if I clear the cookies. No matter how many times I refresh the page the client is still connecting to pusher if I don't clear the cookies.

In the dev tools network tab: https://sockjs-eu.pusher.com/pusher/app/.... instead of https://socket.mydomain.com

In my pusher app I have client events turned off. But in laravel websockets I have them on. I know for sure the clients are connecting to pusher because I get this in the error console: To send client events, you must enable this feature in the Settings page of your dashboard.

I am starting laravel queue worker as a systemctl service too. Might this have anything to do with it? Should they start in a order or something?

EDIT

window.Echo = new Echo({
     broadcaster: 'pusher',
     key: process.env.MIX_PUSHER_APP_KEY,
     cluster: process.env.MIX_PUSHER_APP_CLUSTER,
     wsHost: 'socket.mydomain.com', //this is not the real domain
     wssHost: 'socket.mydomain.com', //this is not the real domain
     wssPort:443,
     forceTLS: true,
     disableStats: true,
 });

Answer 1

try this config

window.Echo = new Echo({
     broadcaster: 'pusher',
     key: 'broadcasting', // hard code
     wsHost: window.location.hostname,
     wssHost: window.location.hostname, 
     enabledTransports: ['ws', 'wss'],
     wssPort:443,
     forceTLS: true,
     disableStats: true,
 });

here key: 'broadcasting' make it hard code and try some time it create issue this is my config may it helps you