Laravel本地HTTPS环境下WebSocket连接失败问题求助

针对你在Windows+XAMPP环境下遇到的WebSocket连接失败问题，按以下步骤排查：

1. 信任自签名证书 #

浏览器默认会拒绝自签名证书的WSS连接，即使HTTP的HTTPS能正常访问。需要将证书导入系统信任根：

• 双击生成的server.crt文件，点击「安装证书」
• 选择「本地计算机」，点击下一步
• 选择「将所有证书放入下列存储」，点击「浏览」
• 选择「受信任的根证书颁发机构」，完成安装
• 重启浏览器生效

2. 验证WebSocket服务的SSL配置 #

• 确认.env中的证书路径正确，且文件存在：

  LARAVEL_WEBSOCKETS_SSL_LOCAL_CERT="C:/xampp/crt/lqs.miso/server.crt"
  LARAVEL_WEBSOCKETS_SSL_LOCAL_PK="C:/xampp/crt/lqs.miso/server.key"
  

• 如果生成证书时设置了密码，需添加：

  LARAVEL_WEBSOCKETS_SSL_PASSPHRASE="你的证书密码"
  

• 确保XAMPP进程有权限读取证书文件（可将证书文件夹权限设置为Everyone可读）

3. 调整前端Echo配置 #

• 强制TLS后，移除明文WS传输，只保留WSS：

  window.Echo = new Echo({
      broadcaster: 'pusher',
      key: 'ABCDEFG',
      wsHost: window.location.hostname,
      wssPort: 6001,
      forceTLS: true,
      disableStats: true,
      enabledTransports: ['wss'] // 移除'ws'
  });
  

• 确保局域网内其他设备的hosts文件也映射了lqs.miso到服务器IP（仅局域网访问时需要）

4. 开放Windows防火墙端口 #

• 打开Windows Defender防火墙，添加入站规则：
  • 类型选择「端口」，下一步
  • 选择「TCP」，输入端口6001，下一步
  • 允许连接，下一步
  • 勾选所有网络类型，命名规则后完成

5. 查看WebSocket服务启动日志 #

启动WebSocket服务时，观察控制台输出：

php artisan websockets:serve

如果有证书加载失败、端口占用等错误，根据日志提示修复（比如端口被占用就换端口，证书路径错误就修正路径）

6. 用wscat测试WSS连接 #

安装wscat工具：

npm install -g wscat

执行测试命令（替换ABCDEFG为你的PUSHER_APP_KEY）：

wscat -c wss://lqs.miso:6001/app/ABCDEFG?protocol=7&client=js&version=7.6.0&flash=false

如果连接失败，wscat会返回具体错误（比如证书不被信任、连接超时），针对性解决

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