Laravel Websockets issues after moving to AWS EC2 LB

When moving your Laravel Websockets setup to an AWS EC2 instance behind a Load Balancer, there are several potential issues that could cause the WebSocket connection to fail. Here are some steps and considerations to help resolve the issue:

1. Security Groups and Ports:

   • Ensure that the security group associated with your EC2 instances allows inbound traffic on port 6001. This is the port your WebSocket server is running on.
   • Also, make sure the Load Balancer's security group allows traffic on port 6001.

2. Load Balancer Configuration:

   • Check if your Load Balancer is configured to handle WebSocket connections. AWS Application Load Balancers (ALB) support WebSockets, but you need to ensure that the listener is set up correctly.
   • If you are using an ALB, make sure that the listener is configured for both HTTP and HTTPS protocols, and that it forwards traffic to the correct target group.

3. SSL/TLS Configuration:

   • If you are using HTTPS (wss://), ensure that your Load Balancer has a valid SSL certificate configured.
   • Verify that the scheme in your config/broadcasting.php is set to 'https' if you are using secure WebSockets.

4. Environment Variables:

   • Double-check your environment variables to ensure they are correctly set. Specifically, verify PUSHER_HOST, PUSHER_PORT, and PUSHER_SCHEME.
   • Ensure that MIX_PUSHER_HOST in your bootstrap.js is set to the domain name of your Load Balancer.

5. CORS and Headers:

   • Ensure that your server is configured to handle CORS requests if your frontend and backend are on different domains.
   • Check if any custom headers are required by your Load Balancer or WebSocket server.

6. Network ACLs:

   • If you have Network ACLs configured, ensure they allow traffic on the necessary ports.

7. Testing Direct Connection:

   • Try connecting directly to the EC2 instance's IP and port 6001 to see if the WebSocket server is reachable without the Load Balancer. This can help isolate whether the issue is with the Load Balancer configuration.

8. Logs and Debugging:

   • Check the logs of your WebSocket server for any errors or warnings.
   • Use browser developer tools to inspect the network requests and see if there are any additional error messages or clues.

Here's a quick checklist for your configuration files:

config/broadcasting.php:

'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'),
        'host' => env('PUSHER_HOST', 'your-load-balancer-domain'),
        'port' => env('PUSHER_PORT', 6001),
        'scheme' => env('PUSHER_SCHEME', 'https'),
        'curl_options' => [
            CURLOPT_SSL_VERIFYHOST => 0,
            CURLOPT_SSL_VERIFYPEER => 0,
        ]
    ],
],

resources/js/bootstrap.js:

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    wsHost: process.env.MIX_PUSHER_HOST || 'your-load-balancer-domain',
    wsPort: 6001,
    wssPort: 6001,
    disableStats: true,
    enabledTransports: ['ws', 'wss']
});

By following these steps and ensuring your configuration is correct, you should be able to resolve the WebSocket connection issues after moving to an AWS EC2 Load Balancer.