生产环境(Ubuntu20.04.4)下Laravel WebSockets频道状态不可用问题

问题场景 #

在Laravel 9.0项目中配置WebSocket并部署到Ubuntu 20.04.4生产环境后，访问/laravel-websockets页面时控制台报错：

pusher.min.js:8 WebSocket connection to 'wss://dev.mydomain.in:6001/app/mywebsocketkey?protocol=7&client=js&version=4.3.1&flash=false' failed:

但使用Postman连接相同URL时却能成功，返回响应：

{
    "event": "pusher:connection_established",
    "data": "{\"socket_id\":\"371175048.259495464\",\"activity_timeout\":30}"
}

已按官方文档完成配置，相关配置文件如下：

配置文件详情 #

broadcast.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'),
                'useTLS' => true,
                'encrypted' => true,
                'host' => 'dev.mydomain.in',
                'port' => 6001,
                'scheme' => 'https',
                'curl_options' => [
                    CURLOPT_SSL_VERIFYHOST => 0,
                    CURLOPT_SSL_VERIFYPEER => 0,
                ]
            ],
            'client_options' => [
                // Guzzle client options
            ],
        ],

websockets.php 配置 #

'apps' => [
        [
            'host' => env('LARAVEL_WEBSOCKETS_HOST', "127.0.0.1"),
            'port' => env('LARAVEL_WEBSOCKETS_PORT', 6001),
            'id' => env('PUSHER_APP_ID'),
            'name' => env('APP_NAME'),
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'path' => env('PUSHER_APP_PATH'),
            'capacity' => null,
            'enable_client_messages' => true,
            'enable_statistics' => true,
            'encrypted' => true
        ],
    ],

bootstrap.js 配置 #

import Echo from "laravel-echo"

window.Pusher = require('pusher-js');

 window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    wsHost: window.location.hostname,
    wsPort: 6001,
    forceTLS: true,
    disableStats: true,    
    enabledTransports: ['ws', 'wss'],
});

.env 配置 #

PUSHER_APP_ID=1234
PUSHER_APP_KEY=mywebsocketkey
PUSHER_APP_SECRET=hjhasjdhajsh
PUSHER_APP_CLUSTER=mt1
LARAVEL_WEBSOCKETS_HOST="dev.mydomain.in"
LARAVEL_WEBSOCKETS_PORT=6001
LARAVEL_WEBSOCKETS_SSL_LOCAL_CERT="/usr/dev/ssl-fullchain.pem"
LARAVEL_WEBSOCKETS_SSL_LOCAL_PK="/usr/dev/ssl.key"
LARAVEL_WEBSOCKETS_SSL_PASSPHRASE=null

排查方向与解决建议 #

1. 浏览器安全策略限制 #

浏览器对WebSocket连接的证书校验比Postman严格：

• 若使用自签名证书，需在浏览器中手动信任该证书，或更换为CA签发的合法证书。
• 确认SSL证书覆盖了dev.mydomain.in域名（部分证书默认仅覆盖80/443端口，需确保WebSocket端口6001的域名也在证书范围内）。

2. 端口访问限制 #

Ubuntu生产环境需确保6001端口对外开放：

• 执行命令开放端口：

  sudo ufw allow 6001/tcp
  sudo ufw reload
  

• 若使用云服务器，需在云服务商安全组中允许6001端口的入站访问。

3. Echo配置冲突调整 #

当前forceTLS设为true但enabledTransports包含ws，可能导致协议冲突：

• 修改enabledTransports仅保留wss：

  enabledTransports: ['wss'],
  

• 通过浏览器控制台打印window.Echo，确认MIX_PUSHER_APP_KEY等环境变量已正确编译到前端资源。

4. WebSocket服务监听地址 #

检查WebSocket服务是否监听公网可访问的地址：

• 执行命令查看监听状态：

  sudo netstat -tulpn | grep 6001
  

  若输出仅显示127.0.0.1:6001，需修改websockets.php的host为0.0.0.0（允许所有地址监听），或确保dev.mydomain.in解析到服务器公网IP。

5. SSL证书权限问题 #

确保WebSocket服务进程能访问证书文件：

• 调整证书文件权限：

  sudo chown www-data:www-data /usr/dev/ssl-fullchain.pem /usr/dev/ssl.key
  sudo chmod 600 /usr/dev/ssl-fullchain.pem /usr/dev/ssl.key
  

• 重启WebSocket服务：

  php artisan websockets:restart
  

内容的提问来源于stack exchange，提问作者asimdev