WebSocket 握手过程

文章目录

- [1. WebSocket 握手过程概述](#1. WebSocket 握手过程概述)
- [2. 客户端发送握手请求](#2. 客户端发送握手请求)
- [3. 服务器响应握手请求](#3. 服务器响应握手请求)
- [4. 客户端验证握手响应](#4. 客户端验证握手响应)
- [5. 建立 WebSocket 连接](#5. 建立 WebSocket 连接)
- [6. 安全性与注意事项](#6. 安全性与注意事项)
- [7. 应用示例](#7. 应用示例)

在现代 Web 开发中，WebSocket 协议因其高效的实时通信能力而被广泛应用。WebSocket 允许客户端和服务器之间建立持久的双向通信连接，从而实现诸如实时聊天、在线游戏、物联网设备监控等场景。然而，WebSocket 连接的建立并非直接开始，而是需要通过一个关键的握手过程来完成协议的升级。本文将详细解析 WebSocket 握手过程，帮助开发者更好地理解和应用这一技术。

1. WebSocket 握手过程概述

WebSocket 握手是建立 WebSocket 连接的第一步，通过 HTTP 请求和响应完成协议从 HTTP 到 WebSocket 的升级。握手过程涉及客户端和服务器之间的协商，确保双方都支持 WebSocket 协议，并通过安全机制防止恶意攻击。

2. 客户端发送握手请求

客户端通过 HTTP/1.1 协议向服务器发送一个特殊的 GET 请求，请求中包含以下关键头信息：

关键头信息

Upgrade websocket： 指示客户端希望升级到 WebSocket 协议。
Connection: Upgrade： 指示客户端希望建立持久连接。
Sec-WebSocket-Key： 一个随机生成的 Base64 编码字符串，用于安全验证。
Sec-WebSocket-Version： 指示客户端使用的 WebSocket 协议版本，通常是 13。

示例请求

bash 复制代码

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

3. 服务器响应握手请求

服务器接收到客户端的握手请求后，会进行验证。如果服务器支持 WebSocket 协议并且验证通过，它将返回一个 HTTP 101 Switching Protocols 响应。
关键头信息

Upgrade: websocket： 确认升级到 WebSocket 协议。
Connection: Upgrade： 确认连接升级。
Sec-WebSocket-Accept： 服务器根据客户端提供的 Sec-WebSocket-Key 计算出的值。计算方法是将 Sec-WebSocket-Key 与一个固定的 GUID ("258EAFA5-E914-47DA-95CA-C5AB0DC85B11") 拼接，然后计算 SHA-1 哈希值，最后进行 Base64 编码。
示例响应

bash 复制代码

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

4. 客户端验证握手响应

客户端收到服务器的响应后，会验证 Sec-WebSocket-Accept 的值是否正确。如果验证通过，握手成功，客户端和服务器之间的连接将从 HTTP 协议升级为 WebSocket 协议。

5. 建立 WebSocket 连接

一旦握手成功，WebSocket 连接建立，客户端和服务器可以通过该连接进行双向数据传输。WebSocket 使用帧格式传输数据，每个帧包含以下字段：

FIN： 指示是否为消息的最后一个片段。
RSV1, RSV2, RSV3： 保留位，用于扩展协议。
Opcode： 操作码，定义帧的类型（如文本帧、二进制帧等）。
Mask： 掩码位，用于防止恶意攻击。
Payload Length： 数据长度。
Payload： 实际传输的数据。

6. 安全性与注意事项

安全性

防止中间人攻击： 通过 Sec-WebSocket-Key 和 Sec-WebSocket-Accept 的校验机制，防止中间人攻击和伪造连接。
使用 SSL/TLS 加密： 通过wss:// 协议进行加密通信，确保数据传输的安全性。

注意事项

协议版本： 客户端和服务器必须支持相同的 WebSocket 协议版本（通常是 13）。
子协议协商： 客户端可以通过 Sec-WebSocket-Protocol 头部协商应用层协议。
跨域问题： WebSocket 不受同源策略限制，但服务器端需要正确配置以允许跨域请求。

7. 应用示例

客户端 JavaScript 示例

js 复制代码

// 创建 WebSocket 连接
const ws = new WebSocket('ws://localhost/link');

// 连接成功事件
ws.onopen = function(event) {
  ws.send('Hello, Server!');
};

// 接收消息
ws.onmessage = function(event) {
  console.log('收到消息:', event.data);
};

// 错误处理
ws.onerror = function(error) {
  console.error('出错了:', error);
};

// 连接关闭事件
ws.onclose = function(event) {
  console.log('连接断开:', event.code, event.reason);
};

服务器端 Node.js 示例

先安装 ws库

js 复制代码

yarn add ws

js 复制代码

const WebSocket = require('ws');
const server = new WebSocket.WebSocketServer({ port: 8080 });

server.on('connection', function(socket) {
  console.log('客户端连接');

  socket.on('message', function(message) {
    console.log('收到消息:', message);
    socket.send('Hello, Client!');
  });

  socket.on('close', function() {
    console.log('客户端已断开');
  });
});