websocket通信 - 技术栈

1.了解websocket通信原理

WebSocket 是一种全双工、长连接 的通信协议，基于 TCP，在一次握手后就保持连接，服务器和客户端可以随时互相发数据，不用像 HTTP 那样每次都重新请求。

2.通信阶段

连接建立 → 2. 通信中 → 3. 连接关闭

事件回调	触发时机	作用
`onopen`	客户端与服务器成功建立 WebSocket 连接时	确认连接成功，可开始收发消息
`onmessage`	客户端收到服务器发送的消息时	处理接收到的文本 / 二进制数据
`onerror`	连接过程中发生错误（如握手失败、网络异常）时	捕获错误信息，用于调试或重连
`onclose`	连接被关闭（主动关闭或意外断开）时	清理资源、记录关闭原因、触发重连逻辑

TypeScript 复制代码

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

// 1. 连接成功建立
socket.onopen = () => {
  console.log('连接已建立，可发送消息');
  socket.send('客户端已上线'); // 连接成功后可立即发送消息
};

// 2. 收到服务器消息
socket.onmessage = (event) => {
  // 处理文本消息
  if (typeof event.data === 'string') {
    console.log('收到文本消息:', event.data);
  }
  // 处理二进制消息（如Blob/ArrayBuffer）
  else if (event.data instanceof Blob) {
    console.log('收到二进制消息:', event.data);
  }
};

// 3. 发生错误
socket.onerror = (error) => {
  console.error('连接错误:', error);
  // 可在这里触发重连逻辑
};

// 4. 连接关闭
socket.onclose = (event) => {
  console.log(`连接关闭，原因: ${event.reason}，代码: ${event.code}`);
  // event.code 为关闭状态码（如1000表示正常关闭，1006表示意外断开）
};

3.WebSocket 常见状态码

标准关闭状态码 (1000-1003)

1000：正常关闭 (Normal Closure)
- 用途：表示连接已完成预期操作
- 典型场景：客户端/服务器主动调用 close(1000, "操作完成")
1001：端点离开 (Going Away)
- 用途：表示端点主动终止连接
- 典型场景：服务器关闭或用户离开网页
1002：协议错误 (Protocol Error)
- 用途：违反 WebSocket 协议规范
- 典型场景：接收到不符合协议规范的帧
1003：不支持的数据类型 (Unsupported Data)
- 用途：端点无法处理接收的数据类型
- 典型场景：服务器仅支持文本消息却收到二进制数据

连接异常中断 (1006)

1006：异常关闭 (Abnormal Closure)
- 特征：连接非正常中断（无明确关闭帧）
- 常见原因：网络中断/服务器崩溃/防火墙阻断
- 注意：该状态码由系统自动生成，不可主动使用

数据处理错误 (1007-1009)

1007：数据格式错误 (Invalid Frame Payload Data)
- 触发条件：数据格式不符合约定
- 示例：文本消息包含非 UTF-8 编码字符
1008：策略违规 (Policy Violation)
- 触发条件：消息内容违反服务器策略
- 示例：包含非法或受限内容
1009：消息过大 (Message Too Big)
- 触发条件：消息尺寸超出处理能力

扩展相关错误 (1010-1011)

1010：必需扩展缺失 (Mandatory Extension)
- 触发条件：服务器不接受客户端要求的扩展
1011：服务器内部错误 (Internal Server Error)
- 触发条件：服务器遭遇不可恢复的错误

TLS 安全错误 (1015)

1015：TLS 握手失败 (TLS Handshake)
- 适用范围：wss:// 加密连接
- 安全限制：该状态码不会通过 onclose 事件直接暴露

自定义状态码规范 (4000-4999)

保留范围 ：4000-4999 用于业务级状态标识
- 典型用例：
  - 4001：认证失败
  - 4002：权限不足
  - 4003：会话超时

特殊说明

状态码 1004 为保留值
常见触发场景：子协议不匹配或鉴权配置错误
解决方案：确保 WebSocket 连接携带有效的认证令牌（需与后端确认具体请求头格式）