Web下的服务器推送技术

注:此为我毕业论文中的一部分,由当时总结而来。

概述

  如今的很多网络应用都需要用到服务器的推送技术,比如炒股网站、实时监控系统、在线聊天等。受限于传统的Web标准中采用的基本都是请求/响应模式,服务器往往处于被动的状况,只能在有数据传输过来的时候才能将数据传输回去,服务器不能直接的给流浪器发送数据,这给那些需要实时进行通讯的应用带来了很多的麻烦。对于那种实时性要求很高的应用来说,它们不希望每次都要刷新或者请求才能获取到数据,它们渴望服务器一有数据更新自己马上就可以被“通知”得到。在这种受限的环境下,基于AJAX、iframe流等方式被提出来并得以解决,不过这并不完美,仍旧是使用请求/响应模式的。Html5的出现,也带来了WebSocket这一项新的内容,它允许浏览器也有socket发送和接收形式。接下来会详细介绍一下这几种方式。

轮询

  由于传统的Web是仅有请求/响应模式的,为了能实时得到消息,那一个简单的做法就是让浏览器不断的去请求服务器以拿到数据。通过前面对于AJAX的介绍,可知浏览器可以调用JavaScript自带的XMLHttpRequest对象和服务器进行交互并获得数据。

  优点:1.AJAX发展已经成熟,这种轮询机制很容易实现。2.不需要服务器进行特殊处理   缺点:1.由于无法预料到什么时候会有数据到达,所以每隔一段时间就要去探测一下服务器有没有新的数据。这个时间如果定得太长,那么消息就变得不及时。如果这个时间定得太短,对服务器的访问过于频繁,会增加服务器的负担。2.不管时间定义的如何,延时肯定会存在的。

  由于探测时间间隔不太好设定,有人想出了一种较为聪明的办法,那就是在没有消息到来的时候,探测时间间隔慢慢增长,如果接收到消息,就把探测时间缩短以达到更好的同步效果。

comet技术

  “Comet”这个术语首先是由Alex Russell 在《Comet: Low Latency Data for the Browser》[22]中定义的。Comet技术实际上可以看成是对上一个方法——“轮询”的一种改进,它基于http的长连接,也仍旧是请求/响应模式。它的基本原理可以概括为:当服务器接收到用户传输过来的请求的时候,并不马上返回数据,而是把它挂起来,等服务器有消息需要传输给当前客户端的时候,才把消息通过该连接返回给客户端。如果该连接超时,服务器就返回一个超时的数据,浏览器收到超时的信息后马上又发起一个新的连接。这样就可以保证客户端和服务端能够一直保持着连接。这项技术在html5的WebSocket成熟之前和不使用其他插件的情况下,是目前最常用的解决方法。

  优点:实时效果好,低延时。   缺点:1.每个客户端都会发起连接,连接要被服务器保持着,需要长期占用着服务器的线程,资源消耗大。2.当用户多的时候,服务器需要开一个线程池,保存着这些线程,也就意味着要对服务器进行特殊的处理,增加开发难度。3.当发生超时的情况时,浏览器和服务器之间是断开的,如果在浏览器发起重新链接之前,服务器收到消息后,要先保存在服务器上等待处理。

  Comet的实现通常有以下2种方式:

  基于AJAX的长轮询[23]: 在服务器和浏览器之间第一次传输完数据(加载网页)之后,AJAX就充当于连接服务器和浏览器的中间件,利用AJAX可以快速的发起一个新连接,并可以设置回调函数允许JavaScript对网页进行局部更新,如果发生错误或超时,JavaScript能够进行正确的判断并处理。基本的AJAX是不允许跨域访问的,这是因为网页出于安全考虑而禁止的。如果需要跨域访问还需要使用到JSONP[24]。

  基于Iframe流的方式: Iframe是嵌在html中的一个框架,通过里面的标签src可以获取到相关地址的页面信息,所以有个形象的比喻就是iframe是html页面中的页面。开发人员通常通过这种方式来加载广告、第三方内容等。实现iframe流的comet技术可以在页面中,插入一个隐藏的iframe,通过其src来建立一个网页到服务器的连接,服务器通过该链接,返回的通常是JavaScript代码,能够让浏览器接受到之后,自动执行,从而更新页面。这种做法简单,但发生错误或者中断的时候难以察觉并做出反应。

利用flash的XMLSocket

  相比于请求/响应模式,Socket是进行双向通讯的最优选择。在HTML5提出来之前,仅有Flash提供了一个XMLSocket类来进行Socket通讯。Flash是一个常见的浏览器插件,可以运行在目前几乎所有的浏览器中,而且Flash自身的actionscript可以和JavaScript相互调用。具体的实现是在HTML中嵌入一个flash文件,网页通过flash提供的接口向服务器发起Socket连接并获得数据,通过网页端JavaScript接收到的xml格式的数据,进行网页的刷新。

  通过XMLSocket这种方式优点就是对服务器要求不高、实时性好。但缺点也有很多:1.客户的浏览器中必须安装有flash插件。2.XMLSocket对于中文支持不太好。3.XMLSocket不具有穿透性,其使用的843端口容易被浏览器拦截[25]。

html5的WebSocket

  html5中的WebSocket才是http上一个真正意义上的Socket连接方式,它支持全双工双向的通讯通道,并具有高速、有状态等特点[26],它的性能高于前面介绍的那几种。它的实现需要新建一个WebSocket实例,之后便可以通过send和onMessage方法来进行发送和监听消息。它的优点很明显:1.速度快而且稳定。 2.相比flash的XMLSocket,它能够穿越防火墙,兼容http反向代理。3. 可以支持传输二进制和文本。缺点是要相对高版本的浏览器才提供WebSocket的支持,比如IE是在IE10之后才提供WebSocket的支持,而且默认是不开启的,其他浏览器如Chrome、Firefox都很早提供了WebSocket的支持。

参考文献

[22]Comet: Alex Russell. Low Latency Data for the Browser [EB/0L].http://alex.dojotoolkit.org/2006/03/comet-low-latency-data-for-the-browser/

[23] 陈航, 赵方. 基于服务器推送技术和 XMPP 的 Web IM 系统实现[J]. 计算机工程与设计, 2010, 31(5): 925-928.

[24] Ippolito B. Remote json-jsonp[J]. 2005.

[25] Mathieu Carbou . 反向 Ajax,第 2 部分: WebSockets[EB/0L]. http://www.ibm.com/developerworks/cn/web/wa-reverseajax2/index.html. 2012.

[26] fins. one Web one Dream —— 新兴Web技术杂谈 之 WebSocket[EB/0L]. http://fins.iteye.com/blog/775257. 2010.

Mikzone