WebSocket 是什麼原理？為什麼可以實現持久連線？

架構師老盧發表於2023-11-30
Web

WebSocket 是一種用於實現持久連線的通訊協議，它的原理和工作方式相對複雜，但我們可以嘗試以儘可能簡單和清晰的方式來解釋它。

WebSocket 的原理

在理解 WebSocket 的工作原理之前，我們首先要了解 HTTP 協議的短連線性質。在傳統的 HTTP 通訊中，客戶端傳送一個請求到伺服器，伺服器響應後就關閉連線，這導致了每個請求都需要建立和關閉連線，而這些連線的建立和關閉會消耗網路資源和時間。

WebSocket 的原理是在 HTTP 協議上建立一種全雙工的通訊方式，使得客戶端和伺服器之間可以建立一次連線，然後保持這個連線的開放狀態，而不需要在每次通訊後關閉連線。這種持久連線使得伺服器可以主動向客戶端推送資料，而不需要等待客戶端的請求。

WebSocket 的工作過程

下面是 WebSocket 的工作過程，包括握手階段和通訊階段：

握手階段：

a. 客戶端發起一個 HTTP 請求，請求升級到 WebSocket 協議。這個請求包含了一些特殊的頭資訊，表明客戶端希望建立 WebSocket 連線。

b. 伺服器收到這個請求後，會進行升級協議的操作，如果支援 WebSocket，它將回復一個 HTTP 101 狀態碼，表示成功升級到 WebSocket 協議。

c. 一旦協議升級完成，客戶端和伺服器之間的連線就變成了全雙工，保持開放狀態，可以雙向通訊。

通訊階段：

a. 客戶端和伺服器可以互相傳送訊息，這些訊息都是以幀（frames）的形式進行傳輸，而不是傳統的 HTTP 請求和響應。

b. 伺服器可以主動向客戶端推送訊息，而客戶端也可以主動向伺服器傳送訊息。這種雙向通訊在實時性要求高的應用中非常有用，比如線上聊天、股票市場資料推送等。

關閉連線：

a. 當雙方中的一方決定關閉連線時，它會傳送一個關閉幀，通知另一方關閉連線。

b. 另一方收到關閉幀後，也會回覆一個關閉幀，然後雙方都關閉連線。

為什麼 WebSocket 可以實現持久連線？

WebSocket 可以實現持久連線的原因有以下幾點：

協議支援：WebSocket 是一種專門設計用於實現持久連線的協議，與傳統的 HTTP 不同。HTTP 是一種請求-響應協議，每次請求後都會關閉連線。WebSocket 則建立在一次握手之後，保持連線開放狀態，允許雙向通訊。

資源節約：傳統的 HTTP 建立和關閉連線會消耗網路資源和時間。WebSocket 的持久連線避免了這種開銷，因此更適用於實時通訊的場景。

實時性：在某些應用中，特別是需要實時性的應用，WebSocket 的持久連線允許伺服器主動向客戶端推送資料，而不需要等待客戶端的請求。這對於線上聊天、實時遊戲、股票市場資料等應用非常重要。

WebSocket 的示例程式碼

下面是一個簡單的 WebSocket 示例，使用 Node.js 來建立一個 WebSocket 伺服器和一個 WebSocket 客戶端：

WebSocket 伺服器示例（Node.js）：

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(`You sent: ${message}`);
  });

  ws.on('close', () => {
    console.log('Client disconnected');
  });
});

WebSocket 客戶端示例（Node.js）：

const WebSocket = require('ws');

const ws = new WebSocket('ws://localhost:8080');

ws.on('open', () => {
  console.log('Connected to server');
  ws.send('Hello, server!');
});

ws.on('message', (message) => {
  console.log(`Received from server: ${message}`);
});

ws.on('close', () => {
  console.log('Disconnected from server');
});

在這個示例中，伺服器和客戶端都使用了 Node.js 的 ws 模組來建立 WebSocket 連線。伺服器監聽在埠 8080 上，當客戶端連線時，會在伺服器端和客戶端之間建立雙向通訊。伺服器接收來自客戶端的訊息，然後將訊息返回給客戶端。

這個示例展示了 WebSocket 的簡單用法，但它可以用作更復雜的實時通訊應用的基礎。WebSocket 的持久連線特性使其成為實時性要求高的應用的理想選擇，如線上聊天、實時遊戲、資料監控等。

相關文章