衣鵬

摘 要

本文主要介紹了Web實(shí)時(shí)消息交互技術(shù)，以及目前在Web應(yīng)用中進(jìn)行實(shí)時(shí)消息交互的一些主流技術(shù)。

【關(guān)鍵詞】Web 實(shí)時(shí)消息

隨著Web的發(fā)展，客戶端與服務(wù)端之間的實(shí)時(shí)消息交互成為人們溝通交流的重要方式。比如門戶網(wǎng)站的實(shí)時(shí)新聞、SNS網(wǎng)站的用戶互動(dòng)、企業(yè)網(wǎng)站的在線客服、大宗商品的即時(shí)交易、遠(yuǎn)程設(shè)備的實(shí)時(shí)監(jiān)控等常見的場(chǎng)景都需要用到基于Web的實(shí)時(shí)消息交互技術(shù)。

1 概述

Web實(shí)時(shí)消息交互應(yīng)用需要服務(wù)器端實(shí)時(shí)地、主動(dòng)地將后臺(tái)出現(xiàn)的變化呈現(xiàn)在客戶端的瀏覽器上，而無需客戶手動(dòng)地去刷新頁面。

在傳統(tǒng)的HTTP請(qǐng)求/響應(yīng)模式下，客戶端每建立一個(gè)連接都要向服務(wù)器端發(fā)送一個(gè)HTTP請(qǐng)求，當(dāng)收到來自服務(wù)器端的HTTP響應(yīng)后，如果該響應(yīng)完全被發(fā)送或接收，服務(wù)器端就會(huì)關(guān)閉該連接。

2 主流的Web實(shí)時(shí)消息交互技術(shù)

2.1 客戶端輪詢模式（Polling）

客戶端通過執(zhí)行網(wǎng)頁中的JS輪詢腳本，經(jīng)由HTTP方式向服務(wù)器端定期循環(huán)的發(fā)送請(qǐng)求，詢問是否有新的消息產(chǎn)生，接收來自服務(wù)器的請(qǐng)求響應(yīng)，返回相應(yīng)信息，如果服務(wù)器端沒有響應(yīng)，則會(huì)在相應(yīng)的指令，關(guān)閉連接，等待后發(fā)送下一個(gè)請(qǐng)求。

優(yōu)點(diǎn)：使用方便，實(shí)現(xiàn)簡(jiǎn)單，開發(fā)成本低，無需做過多的更改。

缺點(diǎn)：如果輪詢間隔過長(zhǎng)，會(huì)導(dǎo)致消息出現(xiàn)延遲，用戶無法及時(shí)接收更新的數(shù)據(jù)。如果輪詢時(shí)間過短，則會(huì)導(dǎo)致查詢請(qǐng)求過多，增加網(wǎng)絡(luò)資源消耗，服務(wù)器易產(chǎn)生峰值請(qǐng)求。

2.2 長(zhǎng)輪詢模式（Long-Polling）

又稱服務(wù)端的輪。它是指當(dāng)客戶端通過執(zhí)行網(wǎng)頁中的JS輪詢腳本，經(jīng)由HTTP方式向服務(wù)器端發(fā)送請(qǐng)求，建立連接后，如果服務(wù)器端沒有新的數(shù)據(jù)，就會(huì)保持連接，不斷地去查詢后臺(tái)消息，等待有效的更新，一旦有新消息產(chǎn)生，服務(wù)器就將消息返回給客戶端。客戶端收到響應(yīng)消息后會(huì)立即關(guān)閉鏈接，并發(fā)送新的請(qǐng)求，開始下一次新的輪詢。

優(yōu)點(diǎn)：時(shí)效性強(qiáng)，消息能及時(shí)返回客戶端；無消息更新不會(huì)頻繁請(qǐng)求，減少了不停地創(chuàng)建、關(guān)閉HTTP請(qǐng)求造成的不必要浪費(fèi)。

缺點(diǎn)：開發(fā)成本高，實(shí)現(xiàn)復(fù)雜，需第三方庫支持；服務(wù)端保持大量連接的維護(hù)開銷大；多個(gè)數(shù)據(jù)發(fā)送會(huì)耗費(fèi)大量的服務(wù)器性能；每次產(chǎn)生消息后都需要重新創(chuàng)建連接。

2.3 基于流的模式（ Http Streaming ）

該模式下，客戶端與服務(wù)器端會(huì)持續(xù)保持連接，當(dāng)服務(wù)器端有新的消息更新時(shí)，服務(wù)器端就會(huì)通過該持續(xù)連接源源不斷的將消息返回給客戶端。該模式與前面的長(zhǎng)輪詢模式相似，只是不需要多次建立連接。

優(yōu)點(diǎn)：新的消息可以實(shí)時(shí)到達(dá)客戶端；客戶端與服務(wù)器端一次建立連接，持續(xù)有效。

缺點(diǎn)：服務(wù)器端需要保持大量連接，及時(shí)響應(yīng)后臺(tái)的消息更新，開銷較大。

2.4 Server-Sent Events （SSE）

SSE模式與長(zhǎng)輪詢類似，區(qū)別在于SSE的每個(gè)連接不只發(fā)送一個(gè)消息，通常會(huì)重用以處理多個(gè)消息。當(dāng)客戶端與服務(wù)器端建立連接后，服務(wù)器端就持續(xù)保持該連接到一個(gè)有效的消息產(chǎn)生，并將該消息返回給客戶端。此時(shí)，先前建立的連接并不關(guān)閉，還可以繼續(xù)用于另一個(gè)有效消息的發(fā)送。一旦有新消息準(zhǔn)備好，該連接就會(huì)將其發(fā)送回客戶端。

優(yōu)點(diǎn)：基于HTML5標(biāo)準(zhǔn)；定義了專用媒體類型text/event-stream；提供了標(biāo)準(zhǔn)JS的客戶端API實(shí)現(xiàn)；開發(fā)實(shí)現(xiàn)簡(jiǎn)單；一個(gè)連接可發(fā)送多個(gè)數(shù)據(jù)。

缺點(diǎn)：服務(wù)器端只能向客戶端單向推送數(shù)據(jù)；主流的IE瀏覽器不支持EventSource。

2.5 HTML5 Websocket

WebSocket是一種復(fù)雜的服務(wù)器端雙向傳輸技術(shù)。它基于HTML5標(biāo)準(zhǔn)，提供了在客戶端與服務(wù)器端進(jìn)行全雙工通訊的網(wǎng)絡(luò)技術(shù)。客戶端和服務(wù)器端只需要通過握手動(dòng)作就能迅速建立一條雙向快速通道，兩者就可以隨意向?qū)Ψ桨l(fā)送數(shù)據(jù)。此時(shí)，在新的WebSocket連接上的交互就不再是基于HTTP協(xié)議了。該技術(shù)可以用于在兩個(gè)方向上快速交互小塊數(shù)據(jù)的應(yīng)用場(chǎng)景中。

優(yōu)點(diǎn)：基于最新的HTML5標(biāo)準(zhǔn)；可以實(shí)現(xiàn)真正的實(shí)時(shí)通訊和雙向交互；大量節(jié)約服務(wù)器資源和帶寬。

缺點(diǎn)：客戶端需要支持HTML5；開發(fā)難度較高，需要專門處理WebSocket協(xié)議。

2.6 Flash XMLSocket

該技術(shù)在頁面中內(nèi)嵌一個(gè)使用了XMLSocket類的Flash程序。JavaScript通過調(diào)用此Flash程序提供的Socket接口與服務(wù)器端的Socket接口進(jìn)行通信。JavaScript在收到服務(wù)器端以XML格式傳送的信息后可以很容易地控制HTML頁面的顯示。

優(yōu)點(diǎn)：增強(qiáng)了客戶端的處理能力；實(shí)現(xiàn)真正的即時(shí)而非偽即時(shí)通信。

缺點(diǎn)：客戶端必須安裝Flash插件；非HTTP協(xié)議；XMLSocket類不能自動(dòng)穿過防火墻；需要設(shè)置一個(gè)通信端口。

2.7 Comet

Comet是一種基于HTTP長(zhǎng)連接、無須在客戶端安裝插件的“服務(wù)器推”技術(shù)。該技術(shù)可使服務(wù)器將更新的信息實(shí)時(shí)地傳送到客戶端，而無須客戶端發(fā)出請(qǐng)求。目前有長(zhǎng)輪詢和Iframe流兩種實(shí)現(xiàn)方式。長(zhǎng)輪詢是在建立連接以后保持，直到服務(wù)器推送數(shù)據(jù)后再關(guān)閉的方式。Iframe流方式是在頁面中插入一個(gè)隱藏的Iframe，利用其src屬性在服務(wù)器和客戶端之間創(chuàng)建一條長(zhǎng)鏈接，服務(wù)器向Iframe傳輸數(shù)據(jù)，來實(shí)時(shí)更新頁面。

優(yōu)點(diǎn)：消息即時(shí)到達(dá)，不發(fā)送無用請(qǐng)求。

缺點(diǎn)：服務(wù)器端維持長(zhǎng)連接會(huì)增加網(wǎng)絡(luò)開銷。

3 結(jié)語

實(shí)時(shí)消息技術(shù)在互聯(lián)網(wǎng)中的應(yīng)用越來越廣，涵蓋的內(nèi)容也越來越多，我們?cè)诖藘H做概略性的介紹。在實(shí)際應(yīng)用中，每種業(yè)務(wù)場(chǎng)景都要考慮各方面的細(xì)節(jié)，具體問題具體對(duì)待，需要大家在實(shí)際的開發(fā)應(yīng)用中見仁見智了。

參考文獻(xiàn)

[1]韋伯，帕拉斯泰迪斯，魯濱遜.REST實(shí)戰(zhàn)[M].南京：東南大學(xué)出版社，2011.

[2]Darren Cook.Data Push Apps with HTML5 SSE[M].O'Reilly Media，2014.

作者單位

七一三七五部隊(duì) 山東省濰坊市 262600