Web應用中的雙向通信_Websocket簡介.doc

Web應用中的雙向通信WebSockets簡介顧勤 譯什么是WebSockets？WebSockets規(guī)范是在HTML5中開始提供的一種瀏覽器與服務器的JavaScript接口，該規(guī)范定義了瀏覽器與服務器之間進行雙全工消息傳送的套接字連接。WebSockets標準大大簡化了服務器與客戶端之間的通信與連接管理。關于HTML5 WebSocketsHTML5 WebSockets 規(guī)范定義了一個API，允許網(wǎng)頁利用WebSockets協(xié)議與遠程主機進行雙向通信。該規(guī)范介紹了WebSockets接口，并定義了一個通過網(wǎng)絡上單一的套接字連接的雙全工通信頻道。相對于兩種模擬雙全工連接的解決方案：輪詢和長輪詢，HTML5 WebSockets降低了大量不必要的網(wǎng)絡傳輸和延遲。HTML5 WebSockets能夠穿過網(wǎng)絡上的一些障礙，如代理和防火墻，讓數(shù)據(jù)流能夠使用任意連接傳輸，并在單一連接中支持上行數(shù)據(jù)流和下行數(shù)據(jù)流，基于HTML5 WebSockets的應用能減少服務器的負擔，使現(xiàn)有的機器能夠支持更多的并發(fā)連接數(shù)。下圖說明了一個基本的WebSocket的架構，該架構中瀏覽器利用WebSocket與服務器進行雙全工、直接的通信。WebSocket的一個獨特的功能就是穿越防火墻和代理的能力，很多應用程序都面臨著這樣的問題。Comet風格的應用程序采用長輪詢作為解決防火墻和代理問題的基本方法。該技術雖有效，但不適用于低于500毫秒的延遲或高吞吐量要求的應用程序。基于插件的技術，如Adobe Flash，也提供一定的套接字接口支持，但長期以來也一直存在難以穿過代理和防火墻的問題，而現(xiàn)在WebSockets解決了這個問題。WebSocket會檢測存在的代理服務器，并自動設置穿越代理的通道。這個通道是通過發(fā)起一個與代理服務的HTTP CONNECT聲明來建立的，這需要代理服務器在指定的主機和端口上打開一個TCP/IP連接。一旦通道創(chuàng)建完成，就可以順利穿過代理進行通信。由于HTTP和HTTPS的工作原理相似，因此通過SSL的安全WebSockets可以采用與HTTP CONNECT相同的方法。要注意的是，現(xiàn)在的瀏覽器都是最近才開始支持WebSockets（Chrome瀏覽器最初版本就支持WebSockets）。然而，今天的瀏覽器都實現(xiàn)了向后兼容性，因而能夠充分利用這一新興技術。WebSocket和其它HTML5支持的特性（如本地存儲和地理定位）一樣，都是原始HTML5規(guī)范的一部分，但為了更加重視，WebSocket被分離成為一個獨立的標準。WebSocket被它的作者網(wǎng)頁超文本技術工作小組（WHATWG）提交給了Internet工程任務組（IETF）。參與標準制定的作者、傳播者和公司，仍將WebSockets視為HTML5原始功能部件的集合中的一部分。WebSocket協(xié)議WebSocket協(xié)議的設計，使它在現(xiàn)有網(wǎng)絡設施的基礎上也能夠很好的工作?；谶@一設計原則，協(xié)議規(guī)定：WebSocket的生命周期從一個HTTP連接開始，以保證完全兼容WebSocket誕生之前的網(wǎng)絡環(huán)境。從HTTP到WebSocket協(xié)議的轉(zhuǎn)換被稱為WebSocket握手。瀏覽器向服務發(fā)送一個請求，表明它要將協(xié)議由HTTP轉(zhuǎn)為WebSocket。客戶端通過HTTP頭中的Upgrade屬性來表達這一請求：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如果服務器支持WebSocket協(xié)議，同樣通過HTTP頭中的Upgrade屬性來表示同意進行協(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此時，HTTP協(xié)議被取消，取而代之的是一個基于TCP/IP的WebSocket連接。WebSocket連接默認使用與HTTP（80）或HTTPS（443）相同的端口。一旦建立起連接，客戶端與服務器之間可以用雙全工模式傳輸WebSocket數(shù)據(jù)幀。文本或二進制幀可以在任意方向上同時進行傳輸。最小的數(shù)據(jù)幀僅為2字節(jié)。如果是文本幀，每幀以0x00開始，以0xFF結束，中間為UTF-8格式的數(shù)據(jù)。WebSocket文本使用終結符，而二進制幀使用長度作為幀的前綴。使用HTML5 WebSocket API通過一個簡潔的接口說明（參見下面的列表），開發(fā)人員可以替代如長輪詢或持久框架，從而進一步降低延遲。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接口非常簡單，要連接到一個終端，只需要創(chuàng)建一個新的WebSocket實例，參照以下的示例，為這個新的對象提供一個表示你想要連接終端的URL。請注意，ws:/和wss:/前綴分別表示普通WebSocket和安全WebSocket連接。var myWebSocket = new WebSocket(ws:/);在客戶端與服務器初次握手時，將HTTP協(xié)議升級成WebSocket協(xié)議，從而創(chuàng)建了一個新的WebSocket連接。通過WebSocket接口中定義的“onmessage”和“send”函數(shù)，將這個連接暴露出來。參照下面的例子，在連接一個終端并發(fā)送消息之前，你可以結合一系列的事件監(jiān)聽器來處理這個連接生命周期的每一個階段。myWebSocket.onopen = function(evt) alert(Connection open .); ; myWebSocket.onmessage = function(evt) alert( Received Message: + evt.data); ; myWebSocket.onclose = function(evt) alert(Connection closed.); ;要將消息發(fā)送到服務器，你只需要簡單的調(diào)用“send”方