精品文檔-下載后可編輯WebSocket技術在實時WEB通訊中的應用研究-設計應用摘要：本文在比較傳統(tǒng)的實時web通訊技術與研究HTML5WebSocket技術基礎上，通過研究WebSocket技術在實時WEB通訊中的應用，體現(xiàn)出WebSocket在B/S模式中的應用優(yōu)勢與價值。

1.前言

作為下一代的Web標準，HTML5擁有許多引人注目的新特性，如Canvas、本地存儲、多媒體編程接口、WebSocket等，有兩大特點：首先，強化Web網頁的表現(xiàn)性能。其次，追加本地數(shù)據(jù)庫等Web應用的功能。包括HTML、CSS和JavaScript在內的一套技術組合，減少瀏覽器對于需要插件的豐富性網絡應用服務（plug-inbasedrichinternetapplication,RIA），如AdobeFlash、MicrosoftSilverlight與OracleJavaFX的需求，并且提供更多能有效增強網絡應用的標準集。而有“Web的TCP”支撐的WebSocket在打破了現(xiàn)有的WEB網絡通訊編程模式，WebSocket使得瀏覽器提供對Socket的支持成為可能，在瀏覽器和服務器之間提供了一個基于TCP連接的雙向通道，使得開發(fā)人員可以方便構建實時Web應用。

2.傳統(tǒng)實時WEB的通訊技術

傳統(tǒng)的Web應用的信息交互過程是客戶端通過瀏覽器發(fā)出一個請求（Request），服務器端接收和審核完請求后進行處理（Response）并返回結果給客戶端，然后客戶端瀏覽器將信息呈現(xiàn)出來，這種機制對于信息變化不是特別頻繁的應用尚能相安無事，但對于那些實時要求比較高的應用來說，當客戶端瀏覽器準備呈現(xiàn)服務器返回的數(shù)據(jù)信息時，信息有可能已經過時了。保持客戶端和服務器端的信息同步是實時Web應用的關鍵要素。在WebSocket規(guī)范出來之前，開發(fā)人員想實現(xiàn)實時Web應用，只能采用如輪詢（Polling）或Comet技術方案，而Comet則是輪詢技術的改進，長輪詢機制與流技術。

輪詢：客戶端以一定的時間間隔向服務端發(fā)出請求，以頻繁請求的方式來保持客戶端和服務器端的同步。問題在于：當客戶端以固定頻率向服務器發(fā)起請求的時候，服務器端的數(shù)據(jù)可能并沒有更新，造成無謂的網絡傳輸，屬于低效的實時方案。

長輪詢：長輪詢是對定時輪詢的改進和提高，目地是降低無效的網絡傳輸。當服務器端沒有數(shù)據(jù)更新時，連接會保持一段時間周期直到數(shù)據(jù)或狀態(tài)改變或者時間過期，通過這種機制來減少無效的客戶端和服務器間的交互。當服務端數(shù)據(jù)變更非常頻繁時，就和定時輪詢沒有本質上性能提高。

流：通常在客戶端的頁面使用一個隱藏的窗口向服務端發(fā)出一個長連接的請求。服務器端接到這個請求后作出回應并不斷更新連接狀態(tài)以保證客戶端和服務器端的連接不過期。

將服務器端的信息不斷推向客戶端。但需要針對不同的瀏覽器設計不同的方案來改進用戶體驗，同時在并發(fā)比較大的情況下，對服務器端的資源是一個極大的考驗。

以上方案只是利用Ajax方式來模擬實時的效果，每次交互都是HTTP的請求和應答的過程，每次都帶有一套完整的HTTP頭信息，增加了傳輸?shù)臄?shù)據(jù)量，在實際的應用中，為了模擬真實的實時效果，需要構造兩個HTTP連接來模擬客戶端和服務器之間的雙向通訊，一個連接用來處理客戶端到服務器端的數(shù)據(jù)傳輸，一個連接用來處理服務器端到客戶端的數(shù)據(jù)傳輸，增加編程實現(xiàn)的復雜度，同時增加了服務器端的負載，制約了應用系統(tǒng)的擴展性。

3.HTML5WebSocket概念及規(guī)范

WebSocketAPI是下一代客戶端-服務器的異步通信方法。取代了單個的TCP套接字，使用ws或wss協(xié)議，在任意的客戶端和服務器程序通訊。WebSocket目前由W3C進行標準化，已經受到Firefox4、Chrome4、Opera10.70以及Safari5等瀏覽器的支持，在給定的時間范圍內的任意時刻，相互推送信息。

HTML5WebSockets從一個Web客戶端連接到一個遠程端點，需要創(chuàng)建WebSocket實例并為之提供一個URL來表示想要連接到的遠程端點。該規(guī)范定義了ws://以及wss://模式來分別表示WebSocket和安全WebSocket連接。一個WebSocket連接是在客戶端與服務器之間HTTP協(xié)議的初始握手階段將其升級到WebSocket協(xié)議來建立的，其底層仍是TCP/IP連接。

其中：

WS:表示HTML5WEBSockets協(xié)議；

Host:表示服務器的地址；

Port:表示待鏈接的端口；

WebSocketServer:表示Server請求資源地址。

WebSockets使用HTTPUpgrade機制升級到WebSocket協(xié)議，同時兼容HTTP的握手機制，因此HTTP服務器可以與WebSocket服務器共享默認的HTTP與HTTPS端（80和443）。要建立一個WebSocket連接，客戶端和服務器在初次握手的時候從HTTP協(xié)議提升到WebSocket協(xié)議?？蛻舳藶g覽器首先要向服務器發(fā)起一個HTTP請求，這個請求和通常的HTTP請求不同，包含了一些附加頭信息，其中附加頭信息“Upgrade:WebSocket”,表明是一個申請協(xié)議升級的HTTP請求，服務器端解析附加的頭信息，產生應答信息返回給客戶端，由此客戶端和服務器端的WebSocket建立成功，然后通過鏈接通道自由傳遞信息，并且持續(xù)到客戶端或者服務器端的單方主動關閉連接。連接建立后，WebSocket數(shù)據(jù)幀以全雙工的模式在客戶端和服務器之間來回傳輸。

典型WebSocket請求與響應例子如下：

其中Sec-WebSocket-Key1,Sec-WebSocket-Key2和[8-bytesecuritykey]這幾個頭信息是WebSocket服務器用來生成應答信息的，服務器基于以下的算法來產生正確的應答信息：

a）逐個字符讀取Sec-WebSocket-Key1頭信息中的值，將數(shù)值型字符連接到一起放到一個臨時字符串里，同時統(tǒng)計所有空格的數(shù)量；

b）將在第1步里生成的數(shù)字字符串轉換成一個整型數(shù)字，然后除以第1步里統(tǒng)計出來的空格數(shù)量，將得到的浮點數(shù)轉換成整數(shù)型；

c）將第2步里生成的整型值轉換為符合網絡傳輸?shù)木W絡字節(jié)數(shù)組；

d）對Sec-WebSocket-Key2頭信息同樣進行第1到第3步的操作，得到另外一個網絡字節(jié)數(shù)組；

e）將[8-bytesecuritykey]和在第3,第4步里生成的網絡字節(jié)數(shù)組合并成一個16字節(jié)的數(shù)組；

f）對第5步生成的字節(jié)數(shù)組使用MD5算法生成一個哈希值，這個哈希值就作為安全密鑰返回給客戶端，以表明服務器端獲取了客戶端的請求，同意創(chuàng)建WebSocket連接。

服務端將生成的網絡字節(jié)數(shù)組和客戶端提交的頭信息里的[8-bytesecuritykey]

合并成一個16位字節(jié)數(shù)組并用MD5算法加密，然后將生成的安全密鑰作為應答信息返回給客戶端，由此建立雙方的WebSocekt連接通道，實現(xiàn)WebSocket握手信息的處理邏輯。WbSocket服務器由兩個類構成，一個是WebSocketServer,另外一個是SocketConnection.

實際的開發(fā)過程中，為構建Web應用，首先需要構建WebSocket規(guī)范的服務器，服務器端的實現(xiàn)不受平臺和開發(fā)語言的限制，只需要遵從WebSocket規(guī)范即可。

如果使用的是一個未加密的WebSocket連接（ws://），在透明的代理服務器情況下，瀏覽器是不知道代理服務器的，所以不會發(fā)送HTTPCONNECT方法。如使用的是加密的WebSocket安全連接（wss://），那么在透明代理服務器下，瀏覽器不知道代理服務器，所以不會發(fā)出HTTPCONNECT方法。然而，因為線上信息是加密的，中間透明代理服務器會簡單的讓加密信息通過，因此就增加了使用加密的WebSocket連接的成功率。

HTML5WebSocket目的是取代輪詢和Comet技術，使客戶端瀏覽器具備像C/S架構下桌面系統(tǒng)的實時通訊能力。瀏覽器通過JavaScript向服務器發(fā)出建立WebSocket連接的請求，連接建立以后，客戶端和服務器端就可以通過TCP連接直接交換數(shù)據(jù)。因為WebSocket連接本質上就是一個TCP連接，所以在數(shù)據(jù)傳輸?shù)姆€(wěn)定性和數(shù)據(jù)傳輸量的大小方面，和輪詢以及Comet技術比較，具有很大的性能優(yōu)勢。

4.WebSocketJavaScript接口定義

針對WebSocketJavaScript客戶端接口定義相對比較簡單：

其中URL屬性代表WebSocket服務器的網絡地址，協(xié)議通常是“ws”,send方法就是發(fā)送數(shù)據(jù)到服務器端，close方法就是關閉連接。除了這些方法，還有一些很重要的事件：

onOpen,onMessage,onError以及onClose.

5.WebSocket應用場景

5.1初始數(shù)據(jù)前臺展示

初始數(shù)據(jù)通過后臺的數(shù)據(jù)推送方法到客戶端，客戶端可以在回調函數(shù)中收到信息，通過HTML5組件來展示這些信息。

5.2后臺推送信息，前臺實時更新

增加后臺推送信息代碼，在后臺起一個定時器，定時推送產生消息或者清除信息，并將信息推送給所有的客戶端。

5.3客戶端拖拽節(jié)點，同步到其他客戶端

增加拖拽同步，監(jiān)聽網