Documentation
Computer Science
Networking
Protocols
WebSocket

WebSocket

WebSocket 是一種在單一 TCP 連線上進行全雙工通訊的協定。

連線流程

WebSocket 連線分為三個步驟：

  1. TCP Connection
  2. WebSocket Handshake
  3. Data Frame 傳輸
  sequenceDiagram
    participant Client
    participant Wss_Server
    Note over Client, Wss_Server: TCP connection
    Client ->> Wss_Server: tcp connection
    Wss_Server ->> Client: tcp connection
    Note over Client, Wss_Server: Websocket handshake
    Client ->> Wss_Server: http upgrade
    Wss_Server ->> Client: http upgrade
    Note over Client, Wss_Server: Data Frame
    Client ->> Wss_Server: control frame:ping
    Wss_Server ->> Client: control frame:pong
    opt client send
    Client ->> Wss_Server: control frame:close
    end
    opt server send
    Wss_Server ->> Client: control frame:close
    end
    Note over Client, Wss_Server: TCP Close

Handshake

WebSocket 握手基於 HTTP/1.1。

Client → Server 

GET /chat HTTP/1.1
Host: server.example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: [UUID encoded by Base64]
Origin: http://example.com
Sec-WebSocket-Protocol: chat, superchat
Sec-WebSocket-Version: 13

Server → Client 

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: [Base64(SHA-1(Sec-WebSocket-Key + GUID))]
Sec-WebSocket-Protocol: chat

重要 Headers

Header說明
Sec-WebSocket-KeyUUID 經 Base64 編碼
Sec-WebSocket-Accept用於證明握手已被接收
Origin防止未經授權的跨域使用

Control Frames

Frame用途
Ping心跳檢測
Pong回應 Ping
Close關閉連線
如果端點收到 Close control frame，必須回應一個 Close frame。

WebSocket vs 其他方案

Long Polling

Client 發送請求，Server 保持連線直到有新資料或超時。

  • Server 回應仍有 HTTP header
  • 沒有管理端點連線狀態的機制

HTTP Stream

Client 發送請求，Server 永不關閉連線。

  • Server 回應仍有 HTTP header
  • 無法管理端點連線狀態

WebSocket 優勢

特性Long PollingHTTP StreamWebSocket
全雙工NoNoYes
低延遲MediumMediumHigh
Header 開銷每次請求一次僅握手
連線管理無無內建

適用場景

  • 即時聊天應用
  • 即時協作工具
  • 線上遊戲
  • 股票行情推送
  • IoT 設備通訊

相關主題

WebRTC