《WebSocket 协议与应用》

1 简介

WebSocket 是客户端与服务器进行全双工通信的网络传输协议，属于应用层协议，基于 TCP，并复用 HTTP 的握手通道。

优点：

支持双向通信，实时性强、更灵活高效；
更好的二进制支持；
更小的控制开销：连接建立后，数据帧头部仅 2~10 字节（不含掩码），客户端到服务端额外多 4 字节掩码；而 HTTP 每次通信都携带完整头部；
支持扩展：可自定义压缩算法等子协议。

2 工作原理

建立连接过程（HTTP Upgrade）：

Client  --GET /chat  Upgrade: websocket  =>  Server
Server  --101 Switching Protocols       =>  Client

握手成功后，双方通过数据帧交换消息，帧格式包含 FIN/opcode/mask/payload length/payload 等字段；维持连接通过心跳（ping/pong）与连接保活完成。

3 Node.js Demo（ws + express）

安装依赖：

npm install ws
npm install express

3.1 服务端

        
      
var app = require("express")();
var server = require("http").Server(app);
var WebSocket = require("ws");

var wss = new WebSocket.Server({ port: 8080 });

wss.on("connection", function connection(ws) {
    console.log("server: receive connection.");

    ws.on("message", function incoming(message) {
        console.log("server: received: %s", message);
    });

    ws.send("world");
});

app.get("/", function (req, res) {
    res.sendFile(__dirname + "/index.html");
});

app.listen(3000);

3.2 客户端（HTML 内使用）

        
      
<script>
  var ws = new WebSocket("ws://localhost:8080");
  ws.onopen = function () {
    console.log("connected");
    ws.send("hello");
  };
  ws.onmessage = function (ev) {
    console.log("message:", ev.data);
  };
  ws.onerror = function (err) {
    console.error("error:", err);
  };
</script>

4 常见问题

4.1 1006 abnormal closure

连接以非正常方式关闭（Unexpected EOF），通常是对端直接断开未回挥手消息。正常结束客户端应发送关闭帧（code 1000）。

4.2 WebSocket 与 HTTP 端口冲突

ws 服务端口与 HTTP 服务端口彼此独立，若同一端口需同时承载 HTTP 与 WebSocket，可在同一服务器上用 upgrade 事件区分处理。

5 参考资料

阅读 — · 全站 —