1. 長鏈接技術介紹

說到websocket，必須講到在它之前的各種長鏈接技術，比如輪循，長輪循，sse等。長鏈接顧名思義，就是讓客戶端瀏覽器與服務器端保持長久的連接，并能持續通訊，它還有一個特點，就是反向ajax，或叫服務器推技術。也就是說，服務器端也能通過這些手段實現向客戶端推送的技術，比如，在現實應用中，看到的股票數據實時更新，這是通過這種技術來實現的。因為服務器端無法主動的向客戶端推送數據，只能通過客戶端連接上服務器端，然后被動地推送數據，這些連接到服務器端或者服務器端向客戶端發送數據的方法就可以分成很多種，比如最簡單的就是通過ajax隔一段時間發送http請求。

像輪循，長輪循等技術并不能實現真正意義上的實時，它是模擬型的實時，它發送的是完整的http請求。下面來具體說一下每個技術的特點。

1.1 輪循

輪循，也叫短輪循，英文名也叫Polling。它很簡單，只是用ajax隔一段時間，可能是1秒，2秒，時間自己設定，向服務器發送請求。這種方案會頻繁地與服務器通訊，每次通訊都是發送完整的http請求，如果服務器經常有數據變動，有回應還好，有時候發送的請求都是沒有意義，都是在等服務器端的回應，而服務器又沒有任何改變，所以這種方式很消耗網絡資源，很低效。

1.2 長輪循

長輪循是對定時輪詢的改進和提高，目地是為了降低無效的網絡傳輸。這種方式也是通過ajax請求發送數據到服務器端，服務器端一直hold住這個連接，直到有數據到達，通過這種機制來減少無效的客戶端和服務器間的交互，比如可以通過這種方式實現簡易型的聊天室，但是，如果服務端的數據變更非常頻繁的話，或者說訪問的人非常多的時候，這種機制和定時輪詢比較起來沒有本質上的性能的提高。

1.3 HTML5 服務器推送事件

英文名也叫HTML5 Server Sent Events (SSE) / EventSource。SSE是html5規范的一部分，它是一種流技術，它的規范由兩部分組成，第一個部分是服務器端與瀏覽器端之間的通訊協議，第二部分則是在瀏覽器端提供 JavaScript 使用的 EventSource 對象。服務器端的響應的內容類型是“text/event-stream”，響應文本的內容可以看成是一個事件流，它能夠持續不斷地向服務器端推送數據。不過這種技術很難跨域，且對IE的支持并不好，但也不能代表這種技術是沒用或過時的，用它結合PostgreSQL的notify，或者Redis的pub/sub可以輕易構建聊天室。

2. websocket

上述的幾種方法不代表就是過時沒用的，相反，在某一程度上，它們還在應用中，只是，現在我們要來介紹一種更為好，更實時的技術，它叫websocket。它也是一種協議，它是基于tcp協議的，它跟http協議同級，它在瀏覽器層次發揮作用，可以由http協議升級為ws協議，就像是http加個安全通道升級為https協議一樣。它的原理是這樣的，由于它是一個協議，它不用發送跟http同樣多的頭信息，它比較輕量，速度快。為了建立一個 WebSocket 連接，客戶端瀏覽器首先要向服務器發起一個 HTTP 請求，這個請求和通常的 HTTP 請求不同，包含了一些附加頭信息，其中附加頭信息”Upgrade: WebSocket”表明這是一個申請協議升級的 HTTP 請求，服務器端解析這些附加的頭信息然后產生應答信息返回給客戶端，客戶端和服務器端的 WebSocket 連接就建立起來了，雙方就可以通過這個連接通道自由的傳遞信息，并且這個連接會持續存在直到客戶端或者服務器端的某一方主動的關閉連接。

在github.com或trello.com等應用就可以看到websocket的使用。比如，github上的：

請求 Request URL:wss://live.github.com/_sockets/NzQwNjQzOjA4NmI3MGI3ODE2N2JmNGI2OTkwNTI1MzA3NjVjNjYxOjgxYTFjMzVlYTE0NDBkYTUxYjllNTc2NmNjYmE1MDg0ZWY2M2ZiZDQ1NWFmOTM5MWIwMmNlYTMzOGZlYWIwMzY=--46b941101badcb9affe775bd52bf902d4b57468c Request Method:GET Status Code:101 Switching Protocols響應頭信息 Response Headers Connection:Upgrade Sec-WebSocket-Accept:ihEYOEOsteVV84Y2koOeMRELVT8= Server:GitHub.com Upgrade:websocket請求頭信息 Request Headers Connection:Upgrade Sec-WebSocket-Extensions:permessage-deflate; client_max_window_bits Sec-WebSocket-Key:+wcmQ7sbHbIF7K/sGpkOKw== Sec-WebSocket-Version:13 Upgrade:websocket

本篇完結。

下一篇：websocket之客戶端與服務器端的交互(二)

總結

以上是生活随笔為你收集整理的websocket 之入门 (一)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。