WebSockets - 雙向通訊

在深入探討 WebSockets 的需求之前，有必要了解一下現有的用於伺服器和客戶端之間雙向通訊的技術。它們如下所示：

輪詢
長輪詢
流傳輸
回發和 AJAX
HTML5

輪詢

輪詢可以定義為一種方法，無論傳輸中是否存在資料，它都會執行週期性請求。週期性請求以同步方式傳送。客戶端在指定的時間間隔內向伺服器傳送週期性請求。伺服器的響應包含可用資料或某些警告訊息。

長輪詢

顧名思義，長輪詢包含與輪詢類似的技術。客戶端和伺服器保持連線活動，直到獲取一些資料或發生超時。如果由於某些原因連線丟失，客戶端可以重新開始並執行順序請求。

長輪詢只不過是對輪詢過程的效能改進，但持續的請求可能會減慢程序。

流傳輸

它被認為是即時資料傳輸的最佳選擇。伺服器保持與客戶端的連線開啟並處於活動狀態，直到獲取所需資料為止。在這種情況下，連線被認為是無限期開啟的。流傳輸包含 HTTP 頭，這會增加檔案大小，從而增加延遲。這可以被認為是一個主要缺點。

AJAX

AJAX 基於 JavaScript 的XmlHttpRequest 物件。它是非同步 JavaScript 和 XML 的縮寫形式。XmlHttpRequest 物件允許執行 JavaScript 而不重新載入整個網頁。AJAX 只發送和接收網頁的一部分。

使用XmlHttpRequest 物件的 AJAX 呼叫的程式碼片段如下所示：

var xhttp;

if (window.XMLHttpRequest) {
   xhttp = new XMLHttpRequest();
} else {
   // code for IE6, IE5
   xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

與WebSockets相比，AJAX的主要缺點是：

它們傳送 HTTP 頭，這使得總大小更大。
通訊是半雙工的。
Web 伺服器消耗更多資源。

HTML5

HTML5 是一個用於開發和設計 Web 應用程式的強大框架。其主要支柱包括標記、CSS3和JavaScript API。

下圖顯示了 HTML5 元件：

以下程式碼片段描述了 HTML5 及其文件型別的宣告。

<!DOCTYPE html>

為什麼我們需要 WebSockets？

網際網路最初被設想為超文字標記語言 (HTML) 頁面的集合，這些頁面相互連結，形成一個概念上的資訊網路。隨著時間的推移，靜態資源的數量增加，更豐富的專案（例如影像）也開始成為網路結構的一部分。

伺服器技術發展使得動態伺服器頁面成為可能——其內容基於查詢生成的頁面。

很快，對更多動態網頁的需求導致了動態超文字標記語言 (DHTML) 的出現。這都要感謝 JavaScript。在接下來的幾年裡，我們看到了跨框架通訊，試圖避免頁面重新載入，然後是框架內的HTTP 輪詢。

但是，這些解決方案都沒有提供真正標準化的跨瀏覽器解決方案，用於伺服器和客戶端之間的即時雙向通訊。

這就產生了對 WebSockets 協議的需求。它催生了全雙工通訊，將桌面豐富的功能帶到了所有 Web 瀏覽器。

列印頁面