5.websocket原理

 

websocket协议原理

1.WebSocket协议是基于TCP的一种新的协议。WebSocket最初在HTML5规范中被引用为TCP连接，作为基于TCP的套接字API的占位符。它实现了浏览器与服务器全双工(full-duplex)通信。其本质是保持TCP连接，在浏览器和服务端通过Socket进行通信

 

2.websocket是建立在http协议之上的

   连接，客户端发起

   握手(验证)，客户端发送一个消息，后端接收到消息再做一些特殊处理并返回，服务端需要支持websocket协议

   收发数据（加密）

    断开连接

 

 

websocket握手流程

• 从请求【握手】信息中提取 Sec-WebSocket-Key
• 利用magic_string 和 Sec-WebSocket-Key 进行hmac1加密，再进行base64加密
• 将加密结果响应给客户端

注：magic string为：258EAFA5-E914-47DA-95CA-C5AB0DC85B11

 

扩展：

　　http协议：\r\n分割、请求头和请求体\r\n分割、无状态、短连接。

　　websocket协议：\r\n分割，创建连接后不断开、验证+数据加密；

 

1.客户端向服务的发送

GET /chatsocket HTTP/1.1
Host: 127.0.0.1:8002
Connection: Upgrade
Pragma: no-cache
Cache-Control: no-cache
Upgrade: websocket
Origin: http://localhost:63342
Sec-WebSocket-Version: 13
Sec-WebSocket-Key: mnwFxiOlctXFN/DeMt1Amg==
Sec-WebSocket-Extensions: permessage-deflate; client_max_window_bits
...
...

\r\n\r\n

 

2.服务的接收返 回

// 1.Sec-WebSocket-Key  与 magic string 进行拼接
// magic string默认为：258EAFA5-E914-47DA-95CA-C5AB0DC85B11
v1 = 'mnwFxiOlctXFN/DeMt1Amg==' + '258EAFA5-E914-47DA-95CA-C5AB0DC85B11'

// 2.将拼接好的结果进行hmac1加密
v2 = hmac1(v1)

// 3. 将hmac1加密过的数据进行base64加密
v3 = base64（v2）

 

// 服务端返回
HTTP/1.1 101 Switching Protocols
Upgrade:websocket
Connection: Upgrade
Sec-WebSocket-Accept:v3 //将加密好的数据通过Sec-WebSocket-Accept返回给前端

 

收发数据(加密)

客户端和服务端传输数据时，以字节的形式进行传输需要对数据进行【封包】和【解包】。客户端的JavaScript类库已经封装【封包】和【解包】过程，但Socket服务端需要手动实现。

流程：

   1.先获取第二个字节，1个字节是8位

   2.再获取第二个字节的后7位 - > payload len

         payload len== 127，向后读取8个字节，然后是其他字节(取4个字节拿到masking key 再去读后面的数据进行解密)

         payload len== 126，向后读取2个字节，再去读取2个字节，然后是其他字节 (取4个字节拿到masking key 再去读后面的数据进行解密)

         payload len<= 125, 向后读取2个字节，然后是其他字节 (取4个字节拿到masking key 再去读后面的数据进行解密)

 

3.获取masking key 进行解密

// 解密算法

var DECODED = "";
for (var i = 0; i < ENCODED.length; i++) {
    DECODED[i] = ENCODED[i] ^ MASK[i % 4];
}