HTML5中的WebSocket連接

• 什麼是WebSocket？

WebSocket 是一種自然的全雙工、雙向、單套接字連接。使用WebSocket，你的HTTP 請求變成打開WebSocket 連接（WebSocket 或者WebSocket over TLS（TransportLayer Security，傳輸層安全性，原稱“SSL”））的單一請求，並且重用從客戶端到服務器以及服務器到客戶端的同一連接。WebSocket 減少了延遲，因爲一旦建立起WebSocket 連接，服務器可以在消息可用時發送它們。例如，和輪詢不同，WebSocket只發出一個請求。服務器不需要等待來自客戶端的請求。相似地，客戶端可以在任何時候向服務器發送消息。相比輪詢不管是否有可用消息，每隔一段時間都發送一個請求，單一請求大大減少了延遲。

• WebSocket API

WebSocket API 使你可以通過Web，在客戶端應用程序和服務器端進程之間建立全雙工的雙向通信。WebSocket 接口規定了可用於客戶端的方法以及客戶端與網絡的交互方式。

• WebSocket構造函數

爲了建立到服務器的WebSocket連接，使用WebSocket接口，通過指向一個代表所要連接端點的URL，實例化一個WebSocket對象。WebSocket 協議定義了兩種URL方案（URL scheme）—ws和wss，分別用於客戶端和服務器之間的非加密與加密流量。
實例：var ws = new WebSocket(“ws://www.websocket.org”);

• WebSocket事件

WebSocket API 是純事件驅動的。應用程序代碼監聽WebSocket對象上的事件，以便處理輸入數據和連接狀態的改變。WebSocket協議也是事件驅動的。
WebSocket對象調度4個不同的事件：
A、open事件：
一旦服務器響應了WebSocket連接請求，open事件觸發並建立一個連接。open事件對應的回調函數稱作onopen
實例：

ws.onopen = function(e) {
    console.log("Connection open...");
};

B、messagess事件：
message事件在接收到消息時觸發，對應於該事件的回調函數是onmessage。
實例：

ws.onmessage = function(e) {
    if(typeof e.data === "string"){
        console.log("String message received", e, e.data);
    } else {
        console.log("Other message received", e, e.data);
    }
};

C、error事件：
error 事件在響應意外故障的時候觸發。與該事件對應的回調函數爲onerror。
實例：

ws.onerror = function(e){
    console.log('websocked error');
    handerError();
}

D、close事件：
close 事件在WebSocket 連接關閉時觸發。對應於close 事件的回調函數是onclose。
實例：

ws.onclose = function(e) {
    console.log("Connection closed", e);
};

• WebSocket方法

WebSocket 對象有兩個方法：send() 和close()。
A、 send() 方法：
使用WebSocket在客戶端和服務器之間建立全雙工雙向連接後，就可以在連接打開時調用send() 方法。使用send() 方法可以從客戶端向服務器發送消息。在發送一條或者多條消息之後，可以保持連接打開，或者調用close() 方法終止連接。
實例:
ws.send(“Hello WebSocket!”);
B、close ()方法：
使用close()方法，可以關閉WebSocket連接或者終止連接嘗試。如果連接已經關閉，該方法就什麼都不做。在調用close()之後，不能在已經關閉的WebSocket上發送任何數據。可以向close()方法傳遞兩個可選參數：code（數字型的狀態代碼）和reason（一個文本字符串）。傳遞這些參數能夠向服務器傳遞關於客戶關閉連接原因的信息。