Devilbox(Docker)与Laravel Websockets整合失败求助及调试咨询

一、核心问题定位 #

你直接请求 wss://example.local:6001/wsapp 是错误的——Devilbox的Nginx是SSL流量入口，6001端口通常未配置SSL证书，且反向代理的作用就是让前端通过Nginx的标准HTTPS端口（443）访问WebSocket服务，而非直接连接6001。

二、关键配置修正 #

1. 确保Nginx反向代理支持WebSocket协议 #

检查 .devilbox/nginx.yml 中的server块，必须包含WebSocket协议升级的配置，示例如下：

location /wsapp {
    proxy_pass http://php:6001; # php是Devilbox默认的PHP容器名，若Websockets在单独容器则替换为对应服务名
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
}

配置后重启Nginx容器：docker-compose restart nginx

2. 修正Laravel Websockets与前端配置 #

• 后端配置：在 config/websockets.php 中确认路径设置：

  'path' => '/wsapp',
  

• 前端Echo配置：修改前端初始化代码，通过Nginx的443端口访问，而非直接连6001：

  window.Echo = new Echo({
      broadcaster: 'pusher',
      key: process.env.MIX_PUSHER_APP_KEY,
      wsHost: window.location.hostname,
      wsPort: 443,
      wssPort: 443,
      forceTLS: true,
      encrypted: true,
      disableStats: true,
      enabledTransports: ['ws', 'wss'],
      path: '/wsapp'
  });
  

3. 检查Docker网络与端口 #

• 确认Laravel Websockets所在容器（默认是Devilbox的php容器）与Nginx容器处于同一Docker网络（Devilbox默认网络为 devilbox_default）。
• 若单独启动Websockets容器，需将其加入Devilbox网络：docker network connect devilbox_default [你的容器名]

三、调试方法 #

1. 容器内测试连接：进入Nginx容器，执行以下命令测试后端WebSocket服务是否可达：

   curl -i -N -H "Connection: Upgrade" -H "Upgrade: websocket" -H "Host: example.local" -H "Origin: https://example.local" http://php:6001/wsapp
   

   若返回包含 101 Switching Protocols 的响应，说明后端服务正常。

2. 查看Websockets实时日志：在Laravel项目目录下启动带调试参数的服务：

   php artisan websockets:serve --debug
   

   观察日志是否有前端连接请求进来，排查是否存在权限或路径匹配问题。

3. 浏览器错误细分：

   • 若提示SSL错误：确认6001端口未配置证书，必须走Nginx的443端口。
   • 若提示404：检查Nginx路径配置与Websockets的path是否完全匹配。
   • 若提示连接超时：检查容器网络连通性，确认6001端口在容器内正常监听。

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