一、前言
websocket是HTML5規範中的一部分，為web應用程序客戶端和服務端之間提供了一種全雙工通信機制（即雙方可同時向對方發送消息），由於websocket借鑑了socket這種思想，因此我們先一起來看看什麼是socket。
二、Socket簡介
socket又稱為“套接字”，應用程序一般通過“套接字”向網絡發出請求或者應答網絡請求，作為Unix的進程通信機制，socket可以實現應用程序間的網絡通信，同時也能夠使用TCP/IP協議或者UDP協議。
三、TCP/IP協議
這兩種協議是目前應用最為廣泛的協議，是構成Internet國際互聯網協議最為基礎的協議，下面來簡單看看這兩種協議。
- 1、TCP協議：面向連接的、可靠的、基於字節流的傳輸層通信協議，負責數據的可靠性傳輸問題。
- 2、IP協議：用於報文交換網絡的一種面向數據的協議，主要負責給每臺網絡設備一個網絡地址，保證數據傳輸到正確的目的地。
四、UDP協議
它是一種無連接、不可靠、基於報文的傳輸層協議，優點是發送後不用管，速度比TCP塊。
五、WebSocket簡介
產生背景： 在B/S結構的軟件項目中，有時候客戶端需要實時的獲得服務器消息，但是為了可以簡化Web服務器，減少服務器的負擔，加快響應速度（因為服務器不需要與客戶端長時間建立一個通信鏈接），默認HTTP協議只支持請求響應模式，因此不容易直接完成實時的消息推送功能，如聊天室、後臺信息提示、實時更新數據等功能，於是就出現了websocket這門技術。
再簡介一次： websocket是HTML5開始提供的一種瀏覽器與服務器間進行的全雙工通訊網路技術。依靠這種技術可以實現客戶端和服務器端的長連接，雙向實時通信。唯一有些不足的是少部分瀏覽器不支持，並且有些瀏覽器支持的程度與方式有區別。
特點： 事件驅動、異步、使用ws或者wss協議的客戶端socket、能夠實現真正意義上的推送功能。
六、WebSocket客戶端
websocket允許通過JavaScript建立與遠程服務器的連接，從而實現客戶端與服務器間的雙向通信。在websocket中有兩個方法：
- 1、send()：向遠程服務器發送數據；
- 2、close()：關閉該websocket鏈接。
websocket同時定義了四個監聽函數：
- 1、onopen當網絡連接建立時觸發該事件；
- 2、當網絡發生錯誤時觸發該事件；
- 3、onclose當websocket被關閉時觸發該事件；
- 4、onmessage當websocket接收到服務器發來消息時觸發的事件，也是通信中最重要的一個監聽事件。
websocket還定義了一個readyState屬性，這個屬性可以返回websocket所處的狀態：
- 1、CONNECTING(0)：websocket正嘗試與服務器建立連接；
- 2、OPEN(1)：websocket與服務器已經建立連接；
- 3、CLOSING(2)：websocket正在關閉與服務器的連接；
- 4、CLOSED(3)：websocket已經關閉了與服務器的連接；
注意：
websocket的url開頭是ws，如果需要ssl加密可以使用wss，當我們調用websocket的構造方法構建一個websocket對象（new WebSocket(url)）的之後，就可以進行即時通信了。點擊查看源代碼
七、WebSocket的通信原理和機制
既然是基於瀏覽器的web技術，那麼它的通信肯定少不了HTTP，websocket本身雖然也是一種新的應用層協議，但是它也不能夠脫離HTTP而單獨存在。
具體來說，我們在客戶端構建一個websocket實例，並且為它綁定一個需要連接到的服務器地址，當客戶端連接到服務端的時候會向服務端發送一個類似下面的HTTP報文：
可以看到，這是一個HTTP的get請求報文，注意該報文中有一個upgrade首部，它的作用是告訴服務端需要將通信協議切換到websocket。如果服務端支持websocket協議，那麼它就會將自己的通信協議切換到websocket，同時發給客戶端類似於以下的一個響應報文頭：
返回的狀態碼為101，表示同意客戶端協議轉換請求，並將它轉換為websocket協議。以上過程都是利用HTTP通信完成的，稱之為websocket協議握手。
經過這握手之後，客戶端和服務端就建立了websocket連接，以後的通信走的都是websocket協議了。所以總結為：websocket握手需要藉助於HTTP協議，建立連接後通信過程使用websocket協議。
同時需要了解的是，該websocket連接還是基於我們剛才發起HTTP連接的那個TCP連接，一旦建立連接之後，我們就可以進行數據傳輸了。在websocket中，提供兩種數據傳輸：文本數據和二進制數據。
基於以上分析，我們可以看到，websocket能夠提供低延遲，高性能的客戶端和服務端的雙向數據通信。它顛覆了之前web開發的請求處理響應模式，並且提供了一種真正意義上的客戶端請求，服務器推送數據的模式，特別適合實時數據交互應用開發。
八、在websocket之前，我們在web上要得到實時數據交互都採用了哪些方式？
（1）定期輪詢方式：
客戶端按照某個時間間隔不斷地向服務端發送請求，請求服務端的最新數據然後更新客戶端顯示。這種方式實際上浪費了大量的流量，並且對服務端造成了很大壓力。
（2）基於長輪詢的服務端推送技術：
具體來講，就是客戶端首先給服務端發送一個請求，服務端收到該請求之後如果數據沒有更新則並不立即返回，服務端阻塞請求的返回，直到數據發生了更新或者發生了連接超時，服務端返回數據之後客戶端再次發送同樣的請求。
（3）基於流式數據傳輸的長連接：
通常的做法是在頁面中嵌入一個隱藏的iframe,然後讓這個iframe的src屬性指向我們請求的一個服務端地址，並且為了數據更新，我們將頁面上數據更新操作封裝為一個js函數，將函數名當做參數傳遞到這個地址當中，服務端收到請求後解析地址取出參數（客戶端js函數調用名），每當有數據更新的時候，返回對客戶端函數的調用，並且將要跟新的數據以js函數的參數填入到返回內容當中。
尾聲
好了，關於今天的技術總結就到這裡，下期再見。
閱讀更多 慕課網 的文章
關鍵字: 軟件 通信 JavaScript
