摘要：國際慣例，先上維基百科的解釋。維基百科上面是維基百科對的解釋，別問我如何解釋上面這段話，因為我也沒看懂，那么下面我用人話解釋一下吧僅僅是我的理解是一個協議，可以簡單看成是協議的一個補充協議，借助協議的基礎完成服務器主動與客戶端實時傳輸數據。

現在，很多網站為了實現推送技術，所用的技術都是輪詢。輪詢是在特定的的時間間隔（如每1秒），由瀏覽器對服務器發出HTTP request，然后由服務器返回最新的數據給客戶端的瀏覽器。這種傳統的模式帶來很明顯的缺點，即瀏覽器需要不斷的向服務器發出請求，然而HTTP request的header是非常長的，里面包含的數據可能只是一個很小的值，這樣會占用很多的帶寬和服務器資源。

Ajax輪詢——“定時的通過Ajax查詢服務端"

而比較新的技術去做輪詢的效果是Comet，使用了AJAX。但這種技術雖然可達到雙向通信，但依然需要發出請求，而且在Comet中，普遍采用了長鏈接，這也會大量消耗服務器帶寬和資源。

Comet——隨著AJAX技術興起而產生的新技術

用大白話揭開Ajax長輪詢(long polling)的神秘面紗

面對這種狀況，HTML5定義了WebSocket協議，能更好的節省服務器資源和帶寬并達到實時通訊。

國際慣例，先上維基百科的解釋。

"WebSocket是HTML5開始提供的一種在單個 TCP 連接上進行全雙工通訊的協議。"
——維基百科

上面是維基百科對WebSocket的解釋，別問我如何解釋上面這段話，因為我也沒看懂，那么下面我用人話解釋一下吧（僅僅是我的理解）：

WebSocket是一個協議，可以簡單看成是HTTP協議的一個補充協議，WebSocket借助HTTP協議的基礎完成服務器主動與客戶端實時傳輸數據。

這是WebSocket和HTTP之間的關系，有交集，但是并不是全部。

WebSocket只是HTML5其中的一個API（HTML5推出了很多新的API，贊），這個API可以通過WebSocket協議實現WebSocket技術。

在WebSocket API中，瀏覽器和服務器只需要做一個握手的動作，然后，瀏覽器和服務器之間就形成了一條快速通道。兩者之間就直接可以數據互相傳送。

關鍵點在于如何"握手"，只要我們完成了握手的這個工作，那么WebScoket技術就算是能夠使用了。

前面說了WebSocket與HTTP有交集的，或者可以說WebSocket借助了HTTP的基礎就是體現在這里了，可以看到圖中的紅點，分別是WebSocket的請求頭和響應頭，一來一回，握手也就完成了，實時連接也就建立起來了！

下面講解一下幾個重要的頭參數：

Request：

Upgrade:WebSocket; //指定WebSocket協議

Sec-WebSocket-Version: 13 //指定Websocket Draft協議版本

Sec-WebSocket-Key：Cv8RLRCr07Ujlqexqq9Nrw== //驗證key值，由瀏覽器隨機生成，可以理解為一個校驗碼

Reponse：

Connection:Upgrade ; Upgrade：webSocket；//沒錯我就是webSocket

Sec-WebSocket-Accept:rC+mM80welcslAqBHpav4MSDzAU= ；//這是返回頭校驗碼，和請求頭的Key配對

Sec-WebSocket-Version: 13 //指定Websocket Draft協議版本

以上就是一次完成的WebSocket握手，握手完之后就可以進行實時通信了。

先上個代碼看看：

本文所用服務端語言為PHP，其他語言可以對照著看，大的原理都一樣：

WebSocket Demo下載鏈接（代碼實在太長，直接下載吧）

使用方法

Windows下要用cmd啟動server.php文件，Linux同理
然后用瀏覽器訪問index.html
Demo是上網找的，不能當做實際用途，簡單看看運行流程就好

代碼需要改的就是index.html的url和server.php的ip。

我講解幾個重要的模塊

server.php：

  "127.0.0.1",
    
    "port"=>"8000",
    
    "event"=>"WSevent",//回調函數的函數名
    
    "log"=>true,
    
    );
    
    $websocket = new websocket($config);
    
    $websocket->run();
    

server.php:通過cmd運行server.php，引用并實例化websocket.class.php類庫，并執行run方法，使其充當一個"服務器"，持續掛著這個連接，當客戶端有消息就做出對應動作。

Index.html：

=======websocket======

Index.html:HTML5提供了WebSocket API，所以，客戶端實例化此API，參數為IP:端口，連接上服務端的WebSocket連接。

function roboot()

write($sign,"Robot:".$show);

$websocket->close($sign);

return;

break;

case "天王蓋地虎":

$array = array("小雞燉蘑菇","寶塔震河妖","粒粒皆辛苦");

$show = $array[rand(0,2)];

break;

default:

$show="( ⊙o⊙?)不懂,你可以嘗試說:hello,name,time,再見,天王蓋地虎.";

}

$websocket->write($sign,"Robot:".$show);

}

function roboot()：指定了客戶端的操作和服務端回復的信息，客戶端發送" 天王蓋地虎"，服務端返回信息" 小雞燉蘑菇"/" 寶塔震河妖"/" 粒粒皆辛苦"。

文章最后來個小科普：

關于Socket 與 WebScoket

Socket 其實并不是一個協議。它工作在 OSI 模型會話層（第5層），是為了方便大家直接使用更底層協議（一般是 TCP 或 UDP ）而存在的一個抽象層。

最早的一套 Socket API 是 Berkeley sockets ，采用 C 語言實現。它是 Socket 的事實標準，POSIX sockets 是基于它構建的，多種編程語言都遵循這套 API，在 JAVA、Python 中都能看到這套 API 的影子。

下面摘錄一段更容易理解的文字（來自 http和socket之長連接和短連接區別）：

Socket是應用層與TCP/IP協議族通信的中間軟件抽象層，它是一組接口。在設計模式中，Socket其實就是一個門面模式，它把復雜的TCP/IP協議族隱藏在Socket接口后面，對用戶來說，一組簡單的接口就是全部，讓Socket去組織數據，以符合指定的協議。

主機 A 的應用程序要能和主機 B 的應用程序通信，必須通過 Socket 建立連接，而建立 Socket 連接必須需要底層 TCP/IP 協議來建立 TCP 連接。建立 TCP 連接需要底層 IP 協議來尋址網絡中的主機。我們知道網絡層使用的 IP 協議可以幫助我們根據 IP 地址來找到目標主機，但是一臺主機上可能運行著多個應用程序，如何才能與指定的應用程序通信就要通過 TCP 或 UPD 的地址也就是端口號來指定。這樣就可以通過一個 Socket 實例唯一代表一個主機上的一個應用程序的通信鏈路了。

而 WebSocket 則不同，它是一個完整的 應用層協議，包含一套標準的 API 。

所以，從使用上來說，WebSocket 更易用，而 Socket 更靈活。

再簡單來說， Socket是一個應用程序接口，是抽象的，WebSocket和HTTP是具體實現，

參考文章：

https://www.zhihu.com/question/20215561 《 知乎回答：什么是WebSocket？》

https://zh.wikipedia.org/wiki/WebSocket 《維基百科：WebSocket》

http://zengrong.net/post/2199.htm 《zrong"s blog》