WebSocket 是一种在单个 TCP 连接上进行全双工通信的网络协议

WebSocket 是一种在单个 TCP 连接上进行全双工通信的网络协议，旨在弥补 HTTP 协议在持久通信能力上的不足。它允许服务器主动向客户端推送数据，实现了真正的双向平等交互。

核心技术特点与优势

1. 全双工与双向通信：传统的 HTTP 只能由客户端发起请求，而 WebSocket 建立连接后，客户端和服务器都可以随时主动向对方发送消息。
2. 持久化长连接：只需完成一次握手，连接便会一直保持。这避免了 HTTP 频繁建立和断开连接带来的资源消耗和延迟。
3. 轻量高效：通信头信息极小，数据格式轻量，不仅支持文本，还支持二进制数据（如图片、音视频），性能开销极低。
4. 无同源限制：客户端可以与任意服务器建立通信，不受浏览器同源策略的限制。

典型应用场景

由于其极强的实时性，WebSocket 被广泛应用于：

• 即时通讯：在线聊天室、社交应用的消息推送。
• 实时数据展示：股票行情、实时监控、在线协同编辑。
• 在线游戏：多人在线游戏的状态同步、机器人控制。
• 其他：扫码登录、直播间弹幕、消息通知等。

---

如何使用 WebSocket（前端 JavaScript 示例）

在现代前端开发中，浏览器原生内置了 WebSocket 对象，无需引入任何额外依赖即可直接使用。以下是标准的 4 步使用流程：

1. 创建连接

使用 new WebSocket() 构造函数并传入服务器地址（明文使用 ws://，加密推荐使用 wss://）。

const socket = new WebSocket('ws://localhost:8080');

2. 监听核心事件

通过绑定事件处理程序，来应对连接的不同状态和接收消息：

// 连接成功建立时触发
socket.onopen = function() {
    console.log('✅ WebSocket 连接成功！');
};

// 收到服务端消息时触发（核心）
socket.onmessage = function(event) {
    console.log('收到消息:', event.data);
};

// 连接关闭时触发
socket.onclose = function() {
    console.log('连接已关闭');
};

// 发生错误时触发
socket.onerror = function(error) {
    console.error('WebSocket 发生错误:', error);
};

3. 发送消息

在连接建立后，使用 send() 方法主动向服务器发送文本或二进制数据：

socket.send('Hello, server!');

4. 关闭连接

当不再需要通信时，主动调用 close() 方法释放资源：

socket.close();

💡 注意事项：

WebSocket 连接的创建和事件处理是异步 的，必须确保在 onopen 事件触发（即连接建立成功）后，再执行发送消息等操作。在实际生产环境中，通常还需要配合心跳保活 和断线重连机制来保证长连接的稳定性。