Web應(yīng)用中的雙向通信_(tái)Websocket簡(jiǎn)介.doc

Web應(yīng)用中的雙向通信WebSockets簡(jiǎn)介顧勤 譯什么是WebSockets？WebSockets規(guī)范是在HTML5中開(kāi)始提供的一種瀏覽器與服務(wù)器的JavaScript接口，該規(guī)范定義了瀏覽器與服務(wù)器之間進(jìn)行雙全工消息傳送的套接字連接。WebSockets標(biāo)準(zhǔn)大大簡(jiǎn)化了服務(wù)器與客戶端之間的通信與連接管理。關(guān)于HTML5 WebSocketsHTML5 WebSockets 規(guī)范定義了一個(gè)API，允許網(wǎng)頁(yè)利用WebSockets協(xié)議與遠(yuǎn)程主機(jī)進(jìn)行雙向通信。該規(guī)范介紹了WebSockets接口，并定義了一個(gè)通過(guò)網(wǎng)絡(luò)上單一的套接字連接的雙全工通信頻道。相對(duì)于兩種模擬雙全工連接的解決方案：輪詢和長(zhǎng)輪詢，HTML5 WebSockets降低了大量不必要的網(wǎng)絡(luò)傳輸和延遲。HTML5 WebSockets能夠穿過(guò)網(wǎng)絡(luò)上的一些障礙，如代理和防火墻，讓數(shù)據(jù)流能夠使用任意連接傳輸，并在單一連接中支持上行數(shù)據(jù)流和下行數(shù)據(jù)流，基于HTML5 WebSockets的應(yīng)用能減少服務(wù)器的負(fù)擔(dān)，使現(xiàn)有的機(jī)器能夠支持更多的并發(fā)連接數(shù)。下圖說(shuō)明了一個(gè)基本的WebSocket的架構(gòu)，該架構(gòu)中瀏覽器利用WebSocket與服務(wù)器進(jìn)行雙全工、直接的通信。WebSocket的一個(gè)獨(dú)特的功能就是穿越防火墻和代理的能力，很多應(yīng)用程序都面臨著這樣的問(wèn)題。Comet風(fēng)格的應(yīng)用程序采用長(zhǎng)輪詢作為解決防火墻和代理問(wèn)題的基本方法。該技術(shù)雖有效，但不適用于低于500毫秒的延遲或高吞吐量要求的應(yīng)用程序?；诓寮募夹g(shù)，如Adobe Flash，也提供一定的套接字接口支持，但長(zhǎng)期以來(lái)也一直存在難以穿過(guò)代理和防火墻的問(wèn)題，而現(xiàn)在WebSockets解決了這個(gè)問(wèn)題。WebSocket會(huì)檢測(cè)存在的代理服務(wù)器，并自動(dòng)設(shè)置穿越代理的通道。這個(gè)通道是通過(guò)發(fā)起一個(gè)與代理服務(wù)的HTTP CONNECT聲明來(lái)建立的，這需要代理服務(wù)器在指定的主機(jī)和端口上打開(kāi)一個(gè)TCP/IP連接。一旦通道創(chuàng)建完成，就可以順利穿過(guò)代理進(jìn)行通信。由于HTTP和HTTPS的工作原理相似，因此通過(guò)SSL的安全WebSockets可以采用與HTTP CONNECT相同的方法。要注意的是，現(xiàn)在的瀏覽器都是最近才開(kāi)始支持WebSockets（Chrome瀏覽器最初版本就支持WebSockets）。然而，今天的瀏覽器都實(shí)現(xiàn)了向后兼容性，因而能夠充分利用這一新興技術(shù)。WebSocket和其它HTML5支持的特性（如本地存儲(chǔ)和地理定位）一樣，都是原始HTML5規(guī)范的一部分，但為了更加重視，WebSocket被分離成為一個(gè)獨(dú)立的標(biāo)準(zhǔn)。WebSocket被它的作者網(wǎng)頁(yè)超文本技術(shù)工作小組（WHATWG）提交給了Internet工程任務(wù)組（IETF）。參與標(biāo)準(zhǔn)制定的作者、傳播者和公司，仍將WebSockets視為HTML5原始功能部件的集合中的一部分。WebSocket協(xié)議WebSocket協(xié)議的設(shè)計(jì)，使它在現(xiàn)有網(wǎng)絡(luò)設(shè)施的基礎(chǔ)上也能夠很好的工作?；谶@一設(shè)計(jì)原則，協(xié)議規(guī)定：WebSocket的生命周期從一個(gè)HTTP連接開(kāi)始，以保證完全兼容WebSocket誕生之前的網(wǎng)絡(luò)環(huán)境。從HTTP到WebSocket協(xié)議的轉(zhuǎn)換被稱為WebSocket握手。瀏覽器向服務(wù)發(fā)送一個(gè)請(qǐng)求，表明它要將協(xié)議由HTTP轉(zhuǎn)為WebSocket?？蛻舳送ㄟ^(guò)HTTP頭中的Upgrade屬性來(lái)表達(dá)這一請(qǐng)求：GET ws://?encoding=text HTTP/1.1 Origin: Cookie: _utma=99as Connection: Upgrade Host: Sec-WebSocket-Key: uRovscZjNol/umbTt5uKmw= Upgrade: websocket Sec-WebSocket-Version: 13如果服務(wù)器支持WebSocket協(xié)議，同樣通過(guò)HTTP頭中的Upgrade屬性來(lái)表示同意進(jìn)行協(xié)議的轉(zhuǎn)換：HTTP/1.1 101 WebSocket Protocol Handshake Date: Fri, 10 Feb 2012 17:38:18 GMT Connection: Upgrade Server: Kaazing Gateway Upgrade: WebSocket Access-Control-Allow-Origin: Access-Control-Allow-Credentials: true Sec-WebSocket-Accept: rLHCkw/SKsO9GAH/ZSFhBATDKrU= Access-Control-Allow-Headers: content-type此時(shí)，HTTP協(xié)議被取消，取而代之的是一個(gè)基于TCP/IP的WebSocket連接。WebSocket連接默認(rèn)使用與HTTP（80）或HTTPS（443）相同的端口。一旦建立起連接，客戶端與服務(wù)器之間可以用雙全工模式傳輸WebSocket數(shù)據(jù)幀。文本或二進(jìn)制幀可以在任意方向上同時(shí)進(jìn)行傳輸。最小的數(shù)據(jù)幀僅為2字節(jié)。如果是文本幀，每幀以0x00開(kāi)始，以0xFF結(jié)束，中間為UTF-8格式的數(shù)據(jù)。WebSocket文本使用終結(jié)符，而二進(jìn)制幀使用長(zhǎng)度作為幀的前綴。使用HTML5 WebSocket API通過(guò)一個(gè)簡(jiǎn)潔的接口說(shuō)明（參見(jiàn)下面的列表），開(kāi)發(fā)人員可以替代如長(zhǎng)輪詢或持久框架，從而進(jìn)一步降低延遲。Constructor(in DOMString url, optional in DOMString protocol) interface WebSocket readonly attribute DOMString URL;/ ready state const unsigned short CONNECTING = 0; const unsigned short OPEN = 1; const unsigned short CLOSED = 2; readonly attribute unsigned short readyState; readonly attribute unsigned long bufferedAmount;/ networking attribute Function onopen; attribute Function onmessage; attribute Function onclose; boolean send(in DOMString data); void close(); ; WebSocket implements EventTarget;使用WebSocket接口非常簡(jiǎn)單，要連接到一個(gè)終端，只需要?jiǎng)?chuàng)建一個(gè)新的WebSocket實(shí)例，參照以下的示例，為這個(gè)新的對(duì)象提供一個(gè)表示你想要連接終端的URL。請(qǐng)注意，ws:/和wss:/前綴分別表示普通WebSocket和安全WebSocket連接。var myWebSocket = new WebSocket(ws:/);在客戶端與服務(wù)器初次握手時(shí)，將HTTP協(xié)議升級(jí)成WebSocket協(xié)議，從而創(chuàng)建了一個(gè)新的WebSocket連接。通過(guò)WebSocket接口中定義的“onmessage”和“send”函數(shù)，將這個(gè)連接暴露出來(lái)。參照下面的例子，在連接一個(gè)終端并發(fā)送消息之前，你可以結(jié)合一系列的事件監(jiān)聽(tīng)器來(lái)處理這個(gè)連接生命周期的每一個(gè)階段。myWebSocket.onopen = function(evt) alert(Connection open .); ; myWebSocket.onmessage = function(evt) alert( Received Message: + evt.data); ; myWebSocket.onclose = function(evt) alert(Connection closed.); ;要將消息發(fā)送到服務(wù)器，你只需要簡(jiǎn)單的調(diào)用“send”方