Node.js 中的原生 WebSocket 客戶端
介紹
自 Node.js v21 起,WebSocket API 已透過 Undici 庫得到增強,引入了內建的 WebSocket 客戶端。這簡化了 Node.js 應用程式的即時通訊。在 Node.js v22.4.0 版本中,WebSocket API 被標記為穩定,表明它已準備好用於生產環境。
什麼是 WebSocket
WebSocket 是一種標準化的通訊協議,它允許在單個 TCP 連線上進行雙向同步通訊。它具有全雙工或雙向能力,這使其區別於 HTTP。WebSocket 透過使用 HTTP Upgrade 頭來轉換協議,從而實現與 HTTP 的相容性。它允許伺服器在沒有初始請求的情況下向客戶端推送內容,並保持開放連線以進行持續的訊息交換,這使其成為即時資料傳輸的理想選擇,其開銷比 HTTP 輪詢等替代方案更低。WebSocket 通訊通常透過 TCP 埠 443(安全)或 80(不安全)進行,這有助於繞過防火牆對非 Web 連線的限制。該協議定義了自己的 URI 方案(ws:// 和 wss://),分別用於未加密和加密的連線,並得到所有主流瀏覽器的支援。
原生 WebSocket 客戶端
Node.js 現在可以充當 WebSocket `客戶端`,而無需依賴 ws 或 socket.io 等外部庫來進行客戶端連線。這使得 Node.js 應用程式可以直接發起和管理傳出的 WebSocket 連線,從而簡化了連線到即時資料來源或與其他 WebSocket 伺服器互動等任務。使用者現在可以使用標準的 new WebSocket() 建構函式建立 WebSocket 客戶端連線。
在上述基礎上,讓我們新增更多實際示例來演示新的 WebSocket 客戶端功能,展示基本用例。
基本連線和訊息處理
// Creates a new WebSocket connection to the specified URL.
const socket = new WebSocket('ws://:8080');
// Executes when the connection is successfully established.
socket.addEventListener('open', event => {
console.log('WebSocket connection established!');
// Sends a message to the WebSocket server.
socket.send('Hello Server!');
});
// Listen for messages and executes when a message is received from the server.
socket.addEventListener('message', event => {
console.log('Message from server: ', event.data);
});
// Executes when the connection is closed, providing the close code and reason.
socket.addEventListener('close', event => {
console.log('WebSocket connection closed:', event.code, event.reason);
});
// Executes if an error occurs during the WebSocket communication.
socket.addEventListener('error', error => {
console.error('WebSocket error:', error);
});
傳送和接收 JSON 資料
const socket = new WebSocket('ws://:8080');
socket.addEventListener('open', () => {
const data = { type: 'message', content: 'Hello from Node.js!' };
socket.send(JSON.stringify(data));
});
socket.addEventListener('message', event => {
try {
const receivedData = JSON.parse(event.data);
console.log('Received JSON:', receivedData);
} catch (error) {
console.error('Error parsing JSON:', error);
console.log('Received data was:', event.data);
}
});
上面的 `json` 程式碼演示了傳送和接收 JSON 資料,這在 WebSocket 應用程式中很常見。它使用 JSON.stringify() 在傳送前將 JavaScript 物件轉換為 JSON 字串,並使用 JSON.parse() 將接收到的字串轉換回 JavaScript 物件。最後,它還包括了對 JSON 解析的錯誤處理。
這減少了依賴管理並提高了相容性。開發人員可以避免安裝和維護額外的 WebSocket 客戶端庫。內建實現符合現代 Web 標準,確保了更好的互操作性。此增強功能專注於 WebSocket 通訊的客戶端,使 Node.js 能夠充當 WebSocket 客戶端。
重要須知
Node.js v22 不提供內建的原生 WebSocket 伺服器實現。要建立接受來自 Web 瀏覽器或其他客戶端的傳入連線的 WebSocket 伺服器,仍需要使用像 ws 或 socket.io 這樣的庫。這意味著雖然 Node.js 現在可以輕鬆連線到 WebSocket 伺服器,但它仍然需要外部工具才能成為一個 WebSocket 伺服器。
總結
Node.js v22 使應用程式能夠作為`客戶端`與 WebSocket 伺服器無縫互動,但在 Node.js 中建立 WebSocket 伺服器仍然依賴於已有的庫。對於開發人員在 Node.js 專案中實現即時通訊時,理解這一區別至關重要。