WebSocket connection failed 如何解决

WebSocket

WebSocket 是一种用于在 Web 应用程序中进行实时双向通信的技术。WebSocket 协议允许客户端和服务器在一个 TCP 连接上进行交换数据。这使得在 Web 上实现实时通信变得更容易。

使用 WebSocket，客户端和服务器之间可以双向通信，因此服务器可以主动向客户端发送更新，而不需要等待客户端请求。这与传统的 HTTP 请求-响应模型非常不同，因为在 HTTP 中，客户端必须发送请求以获取更新。

WebSocket 是 HTML5 的一部分，并由 W3C 规范管理。现代 Web 浏览器通常支持 WebSocket 技术，包括 Chrome，Firefox，Safari 和 Edge。常见的使用 WebSocket 的应用程序包括聊天应用程序，实时协作工具以及在线游戏。

WebSocket connection failed 如何解决

'WebSocket connection failed' 通常表示 Nginx 服务器的 WebSocket 配置有问题。

正确配置 Nginx 服务器以支持 WebSocket 可以解决此问题。

第一步：检查 Nginx 的版本是否支持 WebSocket。如果你的版本是 1.3 或更高版本，则支持 WebSocket。
第二步：编辑你的Nginx配置文件。你应该在nginx.conf文件的server块中找到以下一行配置。

location / {
    # ...
}

第三步：添加以下配置行以启用 WebSocket 支持：

proxy_pass 向代理服务器发送 WebSocket 流量（upstream 为目标网址）
proxy_http_version 将请求协议版本设置为1.1
Upgrade 头的值设置为 $http_upgrade，该值为所有带有 'Upgrade' 标题的请求头
Connection 头的值设置为 'upgrade',以指示连接已经成功升级

location / {
    proxy_pass http: //your_upstream;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_read_timeout 86400;
}

第四步：保存并退出配置文件，并重新启动Nginx服务，以便使更改生效。
第五步：确认你已正确配置 Nginx WebSocket 设置。可以使用以下命令检查 Nginx 是否已配置为支持 WebSocket。

$ nginx -t

第六步：如果命令显示 “OK”，则 WebSocket 已正确配置。如果命令显示错误，请检查并修复你的配置文件。

Apifox 调试 WebSocket 服务

如果你正在编写 WebSocket 服务并需要进行调试，我建议你使用一些很棒的 API 调试工具，如 Apifox，这款工具可以完美调试 WebSocket 服务~

谷歌插件

Apifox 有 Web端和客户端，如果你使用的是 Web端，想要调试本地服务，需要安装 Apifox 的谷歌插件。

下载地址：Apifox 谷歌浏览器插件

新建 WebSocket 请求

WebSocket 是客户端和服务端之间的长链接，因此你需要在 Apifox 中创建一个 WebSocket 请求，以便跳转到 Apifox 界面并填写相应的请求信息。

点击创建按钮并填入 WebSocket 服务的地址。你可以选择填写 Message 和 Params~

立即体验 Apifox

Message 和 Params

Message

在 Message 中，你可以填写要传递到服务端的信息。服务端将接收你发送的信息。

Params

在传输过程中，你也可以携带参数，可以通过在地址上添加查询参数完成，可以携带的数据类型包括：string、integer、number、array。

保存请求

写完所需信息之后，可以点击保存按钮，进行保存，方便下次可继续调用。

连接、发送 WebSocket 请求

连接 WebSocket 服务

我们想要跟服务端进行 WebSocket 通信，就需要先建立一个 WebSocket 连接，我们只需要点击连接。连接成功之后，会有成功的提示。服务端那边也会因为连接成功，而做出响应。

发送 WebSocket 请求

接着我们就可以跟服务端进行 WebSocket 通信了。可以使用 Apifox 点击发送按钮向服务端进行发送 Message、Params。

与 WebSocket 服务通信

发送之后，服务端也可以向客户端发送信息，例如我这里，我设置服务端每秒向客户端发送当时的时间戳~

与 WebSocket 断开连接

如何不想连接了，可以点击断开按钮。

即可断开连接