什么是WebSocket？

WebSocket 是一种网络通信协议，用于在单个 TCP 连接上进行全双工（full-duplex）的通信。WebSocket 提供了一种在客户端和服务器之间进行高效、实时数据交换的方法，它克服了传统的基于轮询或长轮询的 AJAX 技术的一些局限性。

WebSocket 的特点

1. 全双工通信：WebSocket 允许客户端和服务器之间双向通信，无需轮询或长轮询。
2. 低延迟：由于 WebSocket 连接保持开放，所以数据交换的延迟较低。
3. 持久连接：WebSocket 连接通常保持打开状态，直到一方显式关闭连接。
4. 协议简单：WebSocket 的协议相对简单，易于实现。

WebSocket 的工作原理

1. 握手过程：客户端首先通过 HTTP 协议发起一个请求，这个请求类似于普通的 HTTP 请求，但带有特殊的头部信息来指示这是一个 WebSocket 连接请求。服务器响应这个请求，并通过特殊的头部信息来确认连接。

  GET /websocket HTTP/1.1
  Host: example.com
  Upgrade: websocket
  Connection: Upgrade
  Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
  Sec-WebSocket-Version: 13

2. 建立连接：服务器响应这个请求，并通过以下头部信息来确认连接：

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=

3. 数据交换：一旦握手完成，客户端和服务器之间就可以开始发送和接收数据帧。每个数据帧包含一个操作码（opcode），用来指示数据类型，以及可选的数据负载

4. WebSocket 的 API

在 JavaScript 中，WebSocket API 提供了一组方法和事件，用于创建连接、发送数据、接收消息以及处理连接状态的变化。

创建 WebSocket 连接

var socket = new WebSocket('wss://example.com/websocket');

事件处理

• onopen：连接建立时触发。
• onmessage：接收到消息时触发。
• onerror：发生错误时触发。
• onclose：连接关闭时触发。

socket.onopen = function(event) {
    console.log("WebSocket 连接已打开");
};

socket.onmessage = function(event) {
    console.log("从服务器收到消息：" + event.data);
};

socket.onerror = function(error) {
    console.error("WebSocket 错误：" + error);
};