在Javascript和Node中永远挂起的套接字状态

Question

// client.js
const webSocket = new WebSocket('wss://127.0.0.1:8081');

webSocket.addEventListener('open', (message) => {
    alert(message);
})

const text = document.getElementById('text');
const button = document.getElementById('button');

button.onclick = () => {
    webSocket.send(text.value);
}

// server.js
import { Server } from 'net';

const server = new Server();

server.on('connection', (socket) => {
    console.log(socket);

    socket.on('data', (data) => {
     
    })
});

server.listen(8081, '127.0.0.1', () => {
    console.log('Server running at port 8081');
});

我面临的问题是：

< li >当我加载页面时，服务器的控制台中会显示套接字(我可以获取远程地址和远程端口) < li >无论我做什么，客户端中的连接总是挂起。我尝试了Chrome、Brave、Mozilla和Safari，但似乎没有一个能用。

我错过了什么？我试图在连接准备好之前不发送消息，但我从未在我的PC中获得过该状态。即使我在没有事件的情况下建立onopen属性，客户端中的警报也不会弹出。

Uncaught DOMException: Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.
    at button.onclick 

Answer 1

webSocket客户端必须连接到webSocket服务器。webSocket是一种特定的连接算法（从超文本传输协议请求开始，然后切换到webSocket协议）和特定的数据格式。因此，webSocket客户端必须有一个webSocket服务器来连接。您的服务器是不支持webSocket连接的通用TCP服务器。

客户端将首先建立一个TCP套接字到您的服务器，然后通过该套接字发送一个超文本传输协议请求，然后它将坐在那里等待对它发送的超文本传输协议请求的适当响应。由于您的服务器从不发送该响应，它只会坐在那里等待，直到最终超时并关闭套接字。这就是为什么您会看到它被困在待处理状态。它仍在等待其余的webSocket连接序列发生，但它从来没有这样做过。

如果你想知道 webSocket 连接方案和数据格式是如何工作的，你可以在这里看到一个很好的描述。

相关StackOverflow答案：

WebSocket服务器架构如何工作？

WebSocket和普通套接字通信有什么区别？

websocket实现内部使用http协议吗？

webSocket连接方案概述

WebSocket服务器如何处理多个传入连接请求？