WebSocket技術(shù)在實(shí)時(shí)WEB通訊中的應(yīng)用研究
加入技術(shù)交流群
掃碼加入
和技術(shù)大咖面對(duì)面交流
海量資料庫(kù)查詢(xún)
1.前言
作為下一代的Web標(biāo)準(zhǔn)，HTML5擁有許多引人注目的新特性，如Canvas、本地存儲(chǔ)、多媒體編程接口、WebSocket等，有兩大特點(diǎn)：首先，強(qiáng)化Web網(wǎng)頁(yè)的表現(xiàn)性能。其次，追加本地?cái)?shù)據(jù)庫(kù)等Web應(yīng)用的功能。包括HTML、CSS和JavaScript在內(nèi)的一套技術(shù)組合，減少瀏覽器對(duì)于需要插件的豐富性網(wǎng)絡(luò)應(yīng)用服務(wù)(plug-inbasedrich internet application,RIA)，如Adobe Flash、Microsoft Silverlight與OracleJavaFX的需求，并且提供更多能有效增強(qiáng)網(wǎng)絡(luò)應(yīng)用的標(biāo)準(zhǔn)集。而有“Web的TCP”支撐的WebSocket在打破了現(xiàn)有的WEB網(wǎng)絡(luò)通訊編程模式，WebSocket使得瀏覽器提供對(duì)Socket的支持成為可能，在瀏覽器和服務(wù)器之間提供了一個(gè)基于TCP連接的雙向通道，使得開(kāi)發(fā)人員可以方便構(gòu)建實(shí)時(shí)Web應(yīng)用。
2.傳統(tǒng)實(shí)時(shí)WEB的通訊技術(shù)
傳統(tǒng)的Web應(yīng)用的信息交互過(guò)程是客戶(hù)端通過(guò)瀏覽器發(fā)出一個(gè)請(qǐng)求(Request)，服務(wù)器端接收和審核完請(qǐng)求后進(jìn)行處理(Response)并返回結(jié)果給客戶(hù)端，然后客戶(hù)端瀏覽器將信息呈現(xiàn)出來(lái)，這種機(jī)制對(duì)于信息變化不是特別頻繁的應(yīng)用尚能相安無(wú)事，但對(duì)于那些實(shí)時(shí)要求比較高的應(yīng)用來(lái)說(shuō)，當(dāng)客戶(hù)端瀏覽器準(zhǔn)備呈現(xiàn)服務(wù)器返回的數(shù)據(jù)信息時(shí)，信息有可能已經(jīng)過(guò)時(shí)了。保持客戶(hù)端和服務(wù)器端的信息同步是實(shí)時(shí)Web應(yīng)用的關(guān)鍵要素。在WebSocket規(guī)范出來(lái)之前，開(kāi)發(fā)人員想實(shí)現(xiàn)實(shí)時(shí)Web應(yīng)用，只能采用如輪詢(xún)(Polling)或Comet技術(shù)方案，而Comet則是輪詢(xún)技術(shù)的改進(jìn)，長(zhǎng)輪詢(xún)機(jī)制與流技術(shù)。
輪詢(xún)：客戶(hù)端以一定的時(shí)間間隔向服務(wù)端發(fā)出請(qǐng)求，以頻繁請(qǐng)求的方式來(lái)保持客戶(hù)端和服務(wù)器端的同步。問(wèn)題在于：當(dāng)客戶(hù)端以固定頻率向服務(wù)器發(fā)起請(qǐng)求的時(shí)候，服務(wù)器端的數(shù)據(jù)可能并沒(méi)有更新，造成無(wú)謂的網(wǎng)絡(luò)傳輸，屬于低效的實(shí)時(shí)方案。
長(zhǎng)輪詢(xún)：長(zhǎng)輪詢(xún)是對(duì)定時(shí)輪詢(xún)的改進(jìn)和提高，目地是降低無(wú)效的網(wǎng)絡(luò)傳輸。當(dāng)服務(wù)器端沒(méi)有數(shù)據(jù)更新時(shí)，連接會(huì)保持一段時(shí)間周期直到數(shù)據(jù)或狀態(tài)改變或者時(shí)間過(guò)期，通過(guò)這種機(jī)制來(lái)減少無(wú)效的客戶(hù)端和服務(wù)器間的交互。當(dāng)服務(wù)端數(shù)據(jù)變更非常頻繁時(shí)，就和定時(shí)輪詢(xún)沒(méi)有本質(zhì)上性能提高。
流：通常在客戶(hù)端的頁(yè)面使用一個(gè)隱藏的窗口向服務(wù)端發(fā)出一個(gè)長(zhǎng)連接的請(qǐng)求。服務(wù)器端接到這個(gè)請(qǐng)求后作出回應(yīng)并不斷更新連接狀態(tài)以保證客戶(hù)端和服務(wù)器端的連接不過(guò)期。
將服務(wù)器端的信息不斷推向客戶(hù)端。但需要針對(duì)不同的瀏覽器設(shè)計(jì)不同的方案來(lái)改進(jìn)用戶(hù)體驗(yàn)，同時(shí)在并發(fā)比較大的情況下，對(duì)服務(wù)器端的資源是一個(gè)極大的考驗(yàn)。
以上方案只是利用Ajax方式來(lái)模擬實(shí)時(shí)的效果，每次交互都是HTTP的請(qǐng)求和應(yīng)答的過(guò)程，每次都帶有一套完整的HTTP頭信息，增加了傳輸?shù)臄?shù)據(jù)量，在實(shí)際的應(yīng)用中，為了模擬真實(shí)的實(shí)時(shí)效果，需要構(gòu)造兩個(gè)HTTP連接來(lái)模擬客戶(hù)端和服務(wù)器之間的雙向通訊，一個(gè)連接用來(lái)處理客戶(hù)端到服務(wù)器端的數(shù)據(jù)傳輸，一個(gè)連接用來(lái)處理服務(wù)器端到客戶(hù)端的數(shù)據(jù)傳輸，增加編程實(shí)現(xiàn)的復(fù)雜度，同時(shí)增加了服務(wù)器端的負(fù)載，制約了應(yīng)用系統(tǒng)的擴(kuò)展性。
3.HTML 5 WebSocket概念及規(guī)范
WebSocket API是下一代客戶(hù)端-服務(wù)器的異步通信方法。取代了單個(gè)的TCP套接字，使用ws或wss協(xié)議，在任意的客戶(hù)端和服務(wù)器程序通訊。WebSocket目前由W3C進(jìn)行標(biāo)準(zhǔn)化，已經(jīng)受到Firefox 4、Chrome 4、Opera 10.70以及Safari 5等瀏覽器的支持，在給定的時(shí)間范圍內(nèi)的任意時(shí)刻，相互推送信息。
HTML5 Web Sockets從一個(gè)Web客戶(hù)端連接到一個(gè)遠(yuǎn)程端點(diǎn)，需要?jiǎng)?chuàng)建WebSocket實(shí)例并為之提供一個(gè)URL來(lái)表示想要連接到的遠(yuǎn)程端點(diǎn)。該規(guī)范定義了ws://以及wss://模式來(lái)分別表示W(wǎng)ebSocket和安全WebSocket連接。一個(gè)WebSocket連接是在客戶(hù)端與服務(wù)器之間HTTP協(xié)議的初始握手階段將其升級(jí)到Web Socket協(xié)議來(lái)建立的，其底層仍是TCP/IP連接。
其中：
WS:表示HTML5 WEB Sockets協(xié)議;
Host:表示服務(wù)器的地址;
Port:表示待鏈接的端口;
WebSocket Server:表示Server請(qǐng)求資源地址。
Web Sockets使用HTTP Upgrade機(jī)制升級(jí)到Web Socket協(xié)議，同時(shí)兼容HTTP的握手機(jī)制，因此HTTP服務(wù)器可以與WebSocket服務(wù)器共享默認(rèn)的HTTP與HTTPS端(80和443)。要建立一個(gè)WebSocket連接，客戶(hù)端和服務(wù)器在初次握手的時(shí)候從HTTP協(xié)議提升到Web Socket協(xié)議。客戶(hù)端瀏覽器首先要向服務(wù)器發(fā)起一個(gè)HTTP請(qǐng)求，這個(gè)請(qǐng)求和通常的HTTP請(qǐng)求不同，包含了一些附加頭信息，其中附加頭信息“Upgrade:WebSocket”,表明是一個(gè)申請(qǐng)協(xié)議升級(jí)的HTTP請(qǐng)求，服務(wù)器端解析附加的頭信息，產(chǎn)生應(yīng)答信息返回給客戶(hù)端，由此客戶(hù)端和服務(wù)器端的WebSocket建立成功，然后通過(guò)鏈接通道自由傳遞信息，并且持續(xù)到客戶(hù)端或者服務(wù)器端的單方主動(dòng)關(guān)閉連接。連接建立后，WebSocket數(shù)據(jù)幀以全雙工的模式在客戶(hù)端和服務(wù)器之間來(lái)回傳輸。
典型WebSocket請(qǐng)求與響應(yīng)例子如下：
評(píng)論