Skip to content

即時通訊機制(Polling / SSE / WebSocket)

核心導讀

瀏覽器如何實現資料的即時更新? 傳統的 HTTP 協定基於「請求-回應」模型,客戶端必須主動發起請求,伺服器才能回傳資料。如果我們需要實現聊天室、股票行情推送等即時場景,這種模型將面臨挑戰。

本章將介紹前端應對即時資料通訊的三種主要技術:短輪詢(Polling)、伺服器推送事件(SSE)與全雙工 WebSocket,並探討它們的原理與適用場景。


1. 傳統 HTTP 的侷限性

HTTP 協定的設計初衷是用於文件檢索,它具有無狀態(Stateless)由客戶端單向發起的特點:

  1. 客戶端發起 HTTP 請求。
  2. 伺服器處理請求並回傳回應。
  3. 連線完成任務後通常會釋放對應的邏輯請求(HTTP/1.1 雖然支援長連線複用,但業務層面的請求-回應模型並未改變)。

在此模式下,伺服器無法主動將狀態的改變隨時通知正在等待的客戶端。為了取得最新資料,必須尋找其他技術架構方案。


2. 短輪詢(Polling)

最直接的解決方案是短輪詢。即客戶端利用計時器(如 setInterval),每隔一段固定的時間,自動向伺服器發送 HTTP 請求,詢問是否有新資料到達。

技術特點與侷限:

  • 優點:實現機制極為簡單,完全依賴標準的 HTTP 協定和 AJAX/Fetch 技術。
  • 缺點:可能產生巨大的網路開銷與資源浪費。大多數時間裡,伺服器的回應可能是「無新資料」。無論有無資料,每次請求都需要攜帶完整的 HTTP 標頭(Headers、Cookies 等),在並發量較高的場景下,會導致網路資源被大量無意義的查詢佔據。

3. 伺服器推送事件(Server-Sent Events)

為了降低頻繁建立 HTTP 連線的開銷,Server-Sent Events (SSE) 提供了一種輕型的單向資料流推送架構。

SSE 建立在 HTTP 協定之上。客戶端發起一個包含特殊請求標頭(Accept: text/event-stream)的 HTTP 請求後,伺服器在回傳回應時會保持底層的 TCP 連線不斷開。隨後,伺服器可以透過這條持久的通道,持續不斷地向客戶端推送文字格式的資料。

技術特點與侷限:

  • 優點:連線持久化,網路開銷小;瀏覽器原生支援斷線自動重連機制;非常適合從伺服器向客戶端單向傳輸串流資料(例如大型語言模型的文字逐字輸出、即時交易行情推送)。
  • 缺點:通訊通道是單向的。如果客戶端需要向伺服器發起控制指令或傳送新資料,必須另外建立普通的 HTTP 請求。

4. WebSocket:全雙工通訊協定

當應用場景涉及高頻的雙向互動(如多人線上動作遊戲、精密的協同文件編輯)時,我們需要一種既能降低通訊開銷,又能實現真正雙工通訊的技術——WebSocket

WebSocket 是一種獨立的網路通訊協定。它精妙地借助了 HTTP 協定來完成初始建連:

  1. 握手階段:客戶端發送一個特殊的 HTTP 請求,聲明希望將其升級為新協定(攜帶 Upgrade: websocket 標頭)。
  2. 連線質變:伺服器若支援並同意該協定,則回覆 101 Switching Protocols 狀態碼。
  3. 徹底自由:此時 HTTP 的規範使命結束,底層的 TCP 連線被移交給 WebSocket 協定。此後,客戶端與伺服器享有平等的全雙工(Full-Duplex)通訊權利,雙方可隨時收發極簡格式的資料訊框。

技術特點與侷限:

  • 優點:支援真正意義上的雙向即時通訊;資料訊框的標頭資訊極小,通訊延遲低、吞吐效率高;支援原生二進位資料(ArrayBuffer)的傳輸。
  • 缺點:架構與開發複雜性較高;由於維護著持久長連線,對伺服器端的系統架構、負載均衡策略和心跳監測設計提出了更嚴格的工程要求。

5. 總結:技術選型對比

維度短輪詢 (Polling)伺服器推送事件 (SSE)WebSocket
通訊方向客戶端主動輪詢拉取 (單向)伺服器持續主動推送 (單向)客戶端與伺服器享有平等收發權 (雙向全雙工)
底層協定標準 HTTP標準 HTTP獨立的 WebSocket 協定 (基於 TCP)
資料開銷極高 (包含完整的 HTTP 標頭)較低極低 (極簡的資料訊框標頭)
典型應用場景定時檢查後台非同步任務的完成狀態大模型對話單向串流輸出、新聞或系統通知推送即時音視訊信令、多人線上對戰、協同白板與編輯

在實際工程中,開發者應依據具體業務場景對即時性與雙向互動頻率的要求,在系統的維護複雜度和通訊效率之間取得平衡,選擇最契合的技術棧。