四十：如何从HTTP升级到WebSocket

在现代的Web应用中，随着实时通信需求的增加，传统的HTTP协议已无法满足高效、低延迟双向通信的需求。WebSocket协议应运而生，成为了一种解决方案，可以在客户端和服务器之间建立一个持久的双向通信通道。

本文将介绍如何从HTTP协议升级到WebSocket协议，包括WebSocket的握手过程、实现步骤以及需要注意的事项。

什么是WebSocket协议？

WebSocket是一种基于TCP协议的全双工通信协议，能够在客户端和服务器之间提供持久的、低延迟的通信通道。一旦建立连接，WebSocket可以支持实时的双向数据传输，而无需每次请求都重新建立连接。与HTTP协议不同，WebSocket更适合用于即时消息推送、在线游戏、实时股票行情等场景。

从HTTP升级到WebSocket的握手过程

WebSocket连接的建立首先依赖于一个HTTP协议的"握手"过程。这个过程涉及客户端与服务器之间交换一些特定的HTTP头部信息，一旦握手成功，协议便从HTTP升级到WebSocket，之后便可以开始双向数据传输。

1. 客户端发起WebSocket请求

客户端通过发送一个特殊的HTTP请求来请求升级到WebSocket协议。这个请求是通过HTTP协议发送的，但它包含了一些额外的头部信息，告诉服务器客户端希望将连接升级为WebSocket。

请求的关键部分是：

Upgrade: 告诉服务器客户端希望进行协议升级。
Connection: 表示当前连接将被升级。
Sec-WebSocket-Key: 这个随机生成的字符串是WebSocket协议的一部分，用于在握手时验证。
Sec-WebSocket-Version: 指定客户端支持的WebSocket协议版本，当前最新版本是13。

客户端请求的例子：

复制代码

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

2. 服务器响应WebSocket请求

服务器收到客户端的升级请求后，会验证请求的合法性，并通过返回特定的HTTP响应来同意进行协议升级。服务器返回的响应头部信息将确认升级。

响应的关键部分是：

Upgrade: 指示服务器同意进行协议升级。
Connection: 确保连接被正确地升级。
Sec-WebSocket-Accept : 这个值是对客户端Sec-WebSocket-Key进行处理后的结果，主要用于防止请求伪造。

服务器响应的例子：

复制代码

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: dGhlIHNhbXBsZSBub25jZQ==

3. 升级成功，WebSocket连接建立

当客户端收到服务器的101 Switching Protocols响应时，表明WebSocket连接已经成功建立。此时，客户端和服务器之间的通信已经不再使用HTTP协议，而是转换为WebSocket协议，可以进行实时、双向的数据传输。

实现WebSocket连接的步骤

从HTTP协议升级到WebSocket协议的过程在Web开发中非常常见，特别是在需要实时交互的应用场景下。以下是实现这一过程的基本步骤：

1. 客户端实现

在客户端，浏览器支持WebSocket API，因此可以通过JavaScript代码轻松地发起WebSocket连接。示例代码如下：

复制代码

const socket = new WebSocket('ws://example.com/chat');

// 连接成功时的回调函数
socket.onopen = function(event) {
  console.log('WebSocket connection established');
  socket.send('Hello, server!');
};

// 接收到服务器消息时的回调函数
socket.onmessage = function(event) {
  console.log('Received message from server: ' + event.data);
};

// 连接关闭时的回调函数
socket.onclose = function(event) {
  console.log('WebSocket connection closed');
};

// 发生错误时的回调函数
socket.onerror = function(error) {
  console.log('WebSocket error: ' + error);
};

2. 服务器实现

WebSocket协议本身并没有定义具体的服务器实现方式，开发者可以根据自己使用的技术栈选择不同的WebSocket库或框架。以下是使用Node.js和ws库实现WebSocket服务器的一个例子：

首先，安装ws库：

复制代码

npm install ws

然后，在服务器端实现WebSocket连接的处理：

复制代码

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

wss.on('connection', (ws) => {
  console.log('Client connected');
  
  // 监听客户端发送的消息
  ws.on('message', (message) => {
    console.log('Received: ' + message);
  });
  
  // 向客户端发送消息
  ws.send('Hello, client!');
});

3. 确保安全性

WebSocket协议本身并不提供加密，因此对于需要保护数据传输的应用，应当使用WSS（WebSocket Secure）协议，即通过TLS/SSL加密的WebSocket。使用wss://而不是ws://来创建安全的WebSocket连接：

复制代码

const socket = new WebSocket('wss://example.com/chat');

注意事项

协议版本: WebSocket协议的版本可能会随着规范的更新而变化。客户端和服务器必须支持相同的版本才能成功建立连接。当前版本是13，这是大多数浏览器和WebSocket库所支持的版本。
防止滥用: 由于WebSocket连接是持久的，恶意用户可能会滥用这个特性。因此，确保WebSocket连接的安全性非常重要，例如使用身份验证、授权机制，以及限制连接的频率等。
跨域问题: 默认情况下，WebSocket允许跨域通信，但也需要特别注意安全策略，避免未经授权的跨域连接。
服务器资源: WebSocket连接一旦建立，直到连接关闭之前都处于开放状态。因此，服务器需要能够处理大量并发连接，并且要合理地管理资源。