Web应用中的实时消息交互技术

衣鹏

摘 要

本文主要介绍了Web实时消息交互技术，以及目前在Web应用中进行实时消息交互的一些主流技术。

【关键词】Web 实时消息

随着Web的发展，客户端与服务端之间的实时消息交互成为人们沟通交流的重要方式。比如门户网站的实时新闻、SNS网站的用户互动、企业网站的在线客服、大宗商品的即时交易、远程设备的实时监控等常见的场景都需要用到基于Web的实时消息交互技术。

1 概述

Web实时消息交互应用需要服务器端实时地、主动地将后台出现的变化呈现在客户端的浏览器上，而无需客户手动地去刷新页面。

在传统的HTTP请求/响应模式下，客户端每建立一个连接都要向服务器端发送一个HTTP请求，当收到来自服务器端的HTTP响应后，如果该响应完全被发送或接收，服务器端就会关闭该连接。

2 主流的Web实时消息交互技术

2.1 客户端轮询模式（Polling）

客户端通过执行网页中的JS轮询脚本，经由HTTP方式向服务器端定期循环的发送请求，询问是否有新的消息产生，接收来自服务器的请求响应，返回相应信息，如果服务器端没有响应，则会在相应的指令，关闭连接，等待后发送下一个请求。

优点：使用方便，实现简单，開发成本低，无需做过多的更改。

缺点：如果轮询间隔过长，会导致消息出现延迟，用户无法及时接收更新的数据。如果轮询时间过短，则会导致查询请求过多，增加网络资源消耗，服务器易产生峰值请求。

2.2 长轮询模式（Long-Polling）

又称服务端的轮。它是指当客户端通过执行网页中的JS轮询脚本，经由HTTP方式向服务器端发送请求，建立连接后，如果服务器端没有新的数据，就会保持连接，不断地去查询后台消息，等待有效的更新，一旦有新消息产生，服务器就将消息返回给客户端。客户端收到响应消息后会立即关闭链接，并发送新的请求，开始下一次新的轮询。

优点：时效性强，消息能及时返回客户端；无消息更新不会频繁请求，减少了不停地创建、关闭HTTP请求造成的不必要浪费。

缺点：开发成本高，实现复杂，需第三方库支持；服务端保持大量连接的维护开销大；多个数据发送会耗费大量的服务器性能；每次产生消息后都需要重新创建连接。

2.3 基于流的模式（ Http Streaming ）

该模式下，客户端与服务器端会持续保持连接，当服务器端有新的消息更新时，服务器端就会通过该持续连接源源不断的将消息返回给客户端。该模式与前面的长轮询模式相似，只是不需要多次建立连接。

优点：新的消息可以实时到达客户端；客户端与服务器端一次建立连接，持续有效。

缺点：服务器端需要保持大量连接，及时响应后台的消息更新，开销较大。

2.4 Server-Sent Events （SSE）

SSE模式与长轮询类似，区别在于SSE的每个连接不只发送一个消息，通常会重用以处理多个消息。当客户端与服务器端建立连接后，服务器端就持续保持该连接到一个有效的消息产生，并将该消息返回给客户端。此时，先前建立的连接并不关闭，还可以继续用于另一个有效消息的发送。一旦有新消息准备好，该连接就会将其发送回客户端。

优点：基于HTML5标准；定义了专用媒体类型text/event-stream；提供了标准JS的客户端API实现；开发实现简单；一个连接可发送多个数据。

缺点：服务器端只能向客户端单向推送数据；主流的IE浏览器不支持EventSource。

2.5 HTML5 Websocket

WebSocket是一种复杂的服务器端双向传输技术。它基于HTML5标准，提供了在客户端与服务器端进行全双工通讯的网络技术。客户端和服务器端只需要通过握手动作就能迅速建立一条双向快速通道，两者就可以随意向对方发送数据。此时，在新的WebSocket连接上的交互就不再是基于HTTP协议了。该技术可以用于在两个方向上快速交互小块数据的应用场景中。

优点：基于最新的HTML5标准；可以实现真正的实时通讯和双向交互；大量节约服务器资源和带宽。

缺点：客户端需要支持HTML5；开发难度较高，需要专门处理WebSocket协议。

2.6 Flash XMLSocket

该技术在页面中内嵌一个使用了XMLSocket类的Flash程序。JavaScript通过调用此Flash程序提供的Socket接口与服务器端的Socket接口进行通信。JavaScript在收到服务器端以XML格式传送的信息后可以很容易地控制HTML页面的显示。

优点：增强了客户端的处理能力；实现真正的即时而非伪即时通信。

缺点：客户端必须安装Flash插件；非HTTP协议；XMLSocket类不能自动穿过防火墙；需要设置一个通信端口。

2.7 Comet

Comet是一种基于HTTP长连接、无须在客户端安装插件的“服务器推”技术。该技术可使服务器将更新的信息实时地传送到客户端，而无须客户端发出请求。目前有长轮询和Iframe流两种实现方式。长轮询是在建立连接以后保持，直到服务器推送数据后再关闭的方式。Iframe流方式是在页面中插入一个隐藏的Iframe，利用其src属性在服务器和客户端之间创建一条长链接，服务器向Iframe传输数据，来实时更新页面。

优点：消息即时到达，不发送无用请求。

缺点：服务器端维持长连接会增加网络开销。

3 结语

实时消息技术在互联网中的应用越来越广，涵盖的内容也越来越多，我们在此仅做概略性的介绍。在实际应用中，每种业务场景都要考虑各方面的细节，具体问题具体对待，需要大家在实际的开发应用中见仁见智了。

参考文献

[1]韦伯，帕拉斯泰迪斯，鲁滨逊.REST实战[M].南京：东南大学出版社，2011.

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

作者单位

七一三七五部队 山东省潍坊市 262600