目前實(shí)時(shí)Web應(yīng)用的實(shí)現(xiàn)方式，大部分是圍繞輪詢和其他服務(wù)器端推送技術(shù)展開的，其中最著名的是Comet。Comet技術(shù)可以讓服務(wù)器主動(dòng)以異步方式向客戶端推送數(shù)據(jù)。

使用輪詢時(shí)，瀏覽器定期發(fā)送HTTP請(qǐng)求，并隨即接收響應(yīng)；使用長輪詢時(shí)，瀏覽器向服務(wù)器發(fā)送一個(gè)請(qǐng)求，服務(wù)器會(huì)在一段時(shí)間內(nèi)將其保持在打開狀態(tài)；使用流解決方案時(shí)，瀏覽器會(huì)發(fā)送一個(gè)完整的HTTP請(qǐng)求，但服務(wù)器會(huì)發(fā)送并保持一個(gè)處于打開狀態(tài)的響應(yīng)，該響應(yīng)持續(xù)更新并無限期處于打開狀態(tài)。

上述的三個(gè)方法，在發(fā)送實(shí)時(shí)數(shù)據(jù)時(shí)都會(huì)涉及到HTTP請(qǐng)求和響應(yīng)包頭，且包含大量額外的、不必要的報(bào)頭數(shù)據(jù)，會(huì)造成傳輸延遲。

一、解讀HTML5 WebSockets

1、WebSocket握手

為了建立WebSocket通信，客戶端和服務(wù)器在初始握手時(shí)，將HTTP協(xié)議升級(jí)到WebSocket協(xié)議。一旦連接建立成功，就可以在全雙工模式下在客戶端和服務(wù)器之間來回傳送WebSocket消息。

二、HTML5 WebSockets API

本節(jié)討論HTML5 WebSockets的使用方法

1、檢測瀏覽器是否支持

通過window.WebSocket來判斷瀏覽器是否支持。

2、API的基本用法

a. WebSocket對(duì)象的創(chuàng)建以及與WebSocket服務(wù)器的連接

代碼如下:

url = "ws://localhost:8080/echo";

ws = new WebSocket(url);

b. 添加事件監(jiān)聽器

WebSocket遵循異步編程模型，打開socket后，只需等待事件發(fā)生，而不需主動(dòng)向服務(wù)器輪詢，因此需要添加回調(diào)函數(shù)來監(jiān)聽事件。

WebSocket對(duì)象有三個(gè)事件：open、close和message。當(dāng)連接建立時(shí)觸發(fā)open事件，當(dāng)收到消息時(shí)觸發(fā)message事件，當(dāng)WebSocket連接關(guān)閉時(shí)觸發(fā)close事件。

代碼如下:

ws.onopen = function(){

log("open");

}

ws.onmessage = function(){

log(e.data);

}

ws.onclose = function(){

log("closed");

}

c. 發(fā)送消息

當(dāng)socket處于打開狀態(tài)（即調(diào)用onopen監(jiān)聽程序之后，調(diào)用onclose監(jiān)聽程序之前），可以使用send方法發(fā)送消息。

ws.send("Hello World");

總結(jié)

以上是生活随笔為你收集整理的HTML5 API详解（16）:web socket 全双工通信的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。