WebSocketClient.js:16 WebSocket 连接到 'ws://localhost:3000/ws' 失败：React、Docker、NGINX答案

【问题标题】：WebSocketClient.js:16 WebSocket connection to 'ws://localhost:3000/ws' failed: React, Docker, NGINXWebSocketClient.js:16 WebSocket 连接到 'ws://localhost:3000/ws' 失败：React、Docker、NGINX
【发布时间】：2022-01-07 22:41:46
【问题描述】：

这就是问题所在......当我在本地以 npm start 启动 React 应用程序时。我没有 ws 连接失败。

如果我在 Docker 容器中启动 NGINX 和 React 服务器，我会不断得到

WebSocketClient.js:16 WebSocket 连接到 'ws://localhost:3000/ws' 失败：

default.conf

upstream client {
    server client:3000;
}

upstream api {
    server api:5000;
}   

server {
    listen 80;
    
    location / {
        proxy_pass http://client;
    }
    
    location /ws {
        proxy_pass http://client;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
    }
    
    location /api {
        rewrite /api/(.*) /$1 break;
        proxy_pass http://api;
    }
}

【问题讨论】：

这是一个视频sendvid.com/r41axvub

标签： reactjs docker nginx websocket ws

【解决方案1】：

将此添加到 .env：

WDS_SOCKET_PORT=0

有关更多解释和信息，请参阅此问题：https://github.com/facebook/create-react-app/issues/11897

【讨论】：

感谢您的回复。一旦构建项目，它就不会出现在部署阶段。所以它在某种程度上与开发中的代码更改有关。它成功了！
我在尝试使用 docker 修复部署的应用程序时遇到了同样的问题。 NGINX 设置也需要，但最终它对我有用！