為什么要用 websocket ??
HTTP協議決定了服務器與客戶端之間的連接方式,無法直接實現消息推送(F5已壞),一些變相的解決辦法:
雙向通信與消息推送
輪詢:客戶端定時向服務器發送Ajax請求,服務器接到請求后馬上返回響應信息并關閉連接。 優點:后端程序編寫比較容易。 缺點:請求中有大半是無用,浪費帶寬和服務器資源。 實例:適于小型應用。
長輪詢:客戶端向服務器發送Ajax請求,服務器接到請求后hold住連接,直到有新消息才返回響應信息并關閉連接,客戶端處理完響應信息后再向服務器發送新的請求。 優點:在無消息的情況下不會頻繁的請求,耗費資小。 缺點:服務器hold連接會消耗資源,返回數據順序無保證,難于管理維護。 Comet異步的ashx,實例:WebQQ、Hi網頁版、Facebook IM。
長連接:在頁面里嵌入一個隱蔵iframe,將這個隱蔵iframe的src屬性設為對一個長連接的請求或是采用xhr請求,服務器端就能源源不斷地往客戶端輸入數據。 優點:消息即時到達,不發無用請求;管理起來也相對便。 缺點:服務器維護一個長連接會增加開銷。 實例:Gmail聊天
Flash Socket:在頁面中內嵌入一個使用了Socket類的 Flash 程序JavaScript通過調用此Flash程序提供的Socket接口與服務器端的Socket接口進行通信,JavaScript在收到服務器端傳送的信息后控制頁面的顯示。 優點:實現真正的即時通信,而不是偽即時。 缺點:客戶端必須安裝Flash插件;非HTTP協議,無法自動穿越防火墻。 實例:網絡互動游戲。
Websocket
WebSocket是HTML5開始提供的一種瀏覽器與服務器間進行全雙工通訊的網絡技術。依靠這種技術可以實現客戶端和服務器端的長連接,雙向實時通信。
特點:事件驅動
異步使用ws或者wss協議的客戶端socket
能夠實現真正意義上的推送功能
缺點:少部分瀏覽器不支持,瀏覽器支持的程度與方式有區別。
websocket允許通過JavaScript建立與遠程服務器的連接,從而實現客戶端與服務器間雙向的通信。在websocket中有兩個方法
send() 向遠程服務器發送數據
close() 關閉該websocket鏈接
websocket同時還定義了幾個監聽函數
- onopen 當網絡連接建立時觸發該事件
- onerror 當網絡發生錯誤時觸發該事件
- onclose 當websocket被關閉時觸發該事件
- onmessage 當websocket接收到服務器發來的消息的時觸發的事件,也是通信中最重要的一個監聽事件。msg.data
websocket還定義了一個readyState屬性,這個屬性可以返回websocket所處的狀態:
- CONNECTING(0) websocket正嘗試與服務器建立連接
- OPEN(1) websocket與服務器已經建立連接
- CLOSING(2) websocket正在關閉與服務器的連接
- CLOSED(3) websocket已經關閉了與服務器的連接
websocket的兩個屬性:readyState和bufferedAmount
根據readyState屬性可以判斷webSocket的連接狀態,該屬性的值可以是下面幾種:
0 :對應常量 CONNECTING (numeric value 0),
正在建立連接連接,還沒有完成。The connection has not yet been established.
1 :對應常量 OPEN (numeric value 1),
連接成功建立,可以進行通信。The WebSocket connection is established and communication is possible.
2 :對應常量 CLOSING (numeric value 2)
連接正在進行關閉握手,即將關閉。The connection is going through the closing handshake.
3 : 對應常量 CLOSED (numeric value 3)
連接已經關閉或者根本沒有建立。The connection has been closed or could not be opened.