基于Servlet3.0 comet http长连接

标签: servlet3 comet http | 发表时间:2013-11-18 02:22 | 作者:weiboxie
出处:http://www.iteye.com

基于 HTTP 长连接的“服务器推”技术

Comet 简介

浏览器作为 Web 应用的前台,自身的处理功能比较有限。浏览器的发展需要客户端升级软件,同时由于客户端浏览器软件的多样性,在某种意义上,也影响了浏览器新技术的推广。 在 Web 应用中,浏览器的主要工作是发送请求、解析服务器返回的信息以不同的风格显示。AJAX 是浏览器技术发展的成果,通过在浏览器端发送异步请求,提高了单用户操作的响应性。但 Web 本质上是一个多用户的系统,对任何用户来说,可以认为服务器是另外一个用户。现有 AJAX 技术的发展并不能解决在一个多用户的 Web 应用中,将更新的信息实时传送给客户端,从而用户可能在“过时”的信息下进行操作。而 AJAX 的应用又使后台数据更新更加频繁成为可能。


图 1. 传统的 Web 应用模型与基于 AJAX 的模型之比较
图 1. 传统的 Web 应用模型与基于 AJAX 的模型之比较

“服务器推”是一种很早就存在的技术,以前在实现上主要是通过客户端的套接口,或是服务器端的远程调用。因为浏览器技术的 发展比较缓慢,没有为“服务器推”的实现提供很好的支持,在纯浏览器的应用中很难有一个完善的方案去实现“服务器推”并用于商业程序。最近几年,因为 AJAX 技术的普及,以及把 IFrame 嵌在“htmlfile“的 ActiveX 组件中可以解决 IE 的加载显示问题,一些受欢迎的应用如 meebo,gmail+gtalk 在实现中使用了这些新技术;同时“服务器推”在现实应用中确实存在很多需求。因为这些原因,基于纯浏览器的“服务器推”技术开始受到较多关注,Alex Russell(Dojo Toolkit 的项目 Lead)称这种基于 HTTP 长连接、无须在浏览器端安装插件的“服务器推”技术为“Comet”。目前已经出现了一些成熟的 Comet 应用以及各种开源框架;一些 Web 服务器如 Jetty 也在为支持大量并发的长连接进行了很多改进。关于 Comet 技术最新的发展状况请参考关于 Comet 的 wiki。

下面将介绍两种 Comet 应用的实现模型。

基于 AJAX 的长轮询(long-polling)方式

图 1 所示,AJAX 的出现使得 JavaScript 可以调用 XMLHttpRequest 对象发出 HTTP 请求,JavaScript 响应处理函数根据服务器返回的信息对 HTML 页面的显示进行更新。使用 AJAX 实现“服务器推”与传统的 AJAX 应用不同之处在于:

  1. 服务器端会阻塞请求直到有数据传递或超时才返回。
  2. 客户端 JavaScript 响应处理函数会在处理完服务器返回的信息后,再次发出请求,重新建立连接。
  3. 当客户端处理接收的数据、重新建立连接时,服务器端可能有新的数据到达;这些信息会被服务器端保存直到客户端重新建立连接,客户端会一次把当前服务器端所有的信息取回。


图 2. 基于长轮询的服务器推模型
图 2. 基于长轮询的服务器推模型

一些应用及示例如 “Meebo”, “Pushlet Chat” 都采用了这种长轮询的方式。相对于“轮询”(poll),这种长轮询方式也可以称为“拉”(pull)。因为这种方案基于 AJAX,具有以下一些优点:请求异步发出;无须安装插件;IE、Mozilla FireFox 都支持 AJAX。

在这种长轮询方式下,客户端是在 XMLHttpRequest 的 readystate 为 4(即数据传输结束)时调用回调函数,进行信息处理。当 readystate 为 4 时,数据传输结束,连接已经关闭。Mozilla Firefox 提供了对 Streaming AJAX 的支持, 即 readystate 为 3 时(数据仍在传输中),客户端可以读取数据,从而无须关闭连接,就能读取处理服务器端返回的信息。IE 在 readystate 为 3 时,不能读取服务器返回的数据,目前 IE 不支持基于 Streaming AJAX。

基于 Iframe 及 htmlfile 的流(streaming)方式

iframe 是很早就存在的一种 HTML 标记, 通过在 HTML 页面里嵌入一个隐蔵帧,然后将这个隐蔵帧的 SRC 属性设为对一个长连接的请求,服务器端就能源源不断地往客户端输入数据。


图 3. 基于流方式的服务器推模型
图 3. 基于流方式的服务器推模型

上节提到的 AJAX 方案是在 JavaScript 里处理 XMLHttpRequest 从服务器取回的数据,然后 Javascript 可以很方便的去控制 HTML 页面的显示。同样的思路用在 iframe 方案的客户端,iframe 服务器端并不返回直接显示在页面的数据,而是返回对客户端 Javascript 函数的调用,如“ <script type="text/javascript">js_func(“data from server ”)</script>”。服务器端将返回的数据作为客户端 JavaScript 函数的参数传递;客户端浏览器的 Javascript 引擎在收到服务器返回的 JavaScript 调用时就会去执行代码。

图 3 可以看到,每次数据传送不会关闭连接,连接只会在通信出现错误时,或是连接重建时关闭(一些防火墙常被设置为丢弃过长的连接, 服务器端可以设置一个超时时间, 超时后通知客户端重新建立连接,并关闭原来的连接)。

使用 iframe 请求一个长连接有一个很明显的不足之处:IE、Morzilla Firefox 下端的进度栏都会显示加载没有完成,而且 IE 上方的图标会不停的转动,表示加载正在进行。Google 的天才们使用一个称为“htmlfile”的 ActiveX 解决了在 IE 中的加载显示问题,并将这种方法用到了 gmail+gtalk 产品中。Alex Russell 在 “What else is burried down in the depth's of Google's amazing JavaScript?”文章中介绍了这种方法。Zeitoun 网站提供的 comet-iframe.tar.gz,封装了一个基于 iframe 和 htmlfile 的 JavaScript comet 对象,支持 IE、Mozilla Firefox 浏览器,可以作为参考。(请参见 参考资源

@WebServlet(urlPatterns = { "/course/comet" }, asyncSupported = true)
public class CourseCometServlet extends HttpServlet {

    private PublishService publishService = SpringBeanLocator.getInstance().getBean(PublishService.class);

    //  private final Logger log = LoggerFactory.getLogger(getClass());

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        //  response.reset();
        response.setContentType("text/html; charset=UTF-8");
        response.setHeader("Cache-Control", "no-cache, must-revalidate");
        response.setHeader("Expires", "Mon, 27 Jul 1997 05:00:00 GMT");
        response.setCharacterEncoding("UTF-8");
        final int sid = DataUtil.toInt(request.getParameter("sid"));

        final PrintWriter writer = response.getWriter();

        // 创建Comet Iframe
        writer.println("<!DOCTYPE html>");
        String ua = request.getHeader("User-Agent");
        if (ua.contains("Safari")) {
            // 多打几个,因为Safari至少需要1k数据才会开始渲染。
            for (int i = 0; i < 100; i++) {
                writer.println("<span></span>");
            }
        }
        writer.println("<script>var comet = window.parent.comet;</script>");
        writer.flush();

        try {
            final AsyncContext ac = request.startAsync();
            publishService.add(sid, ac);
            ac.setTimeout(20 * 60 * 1000);// 10分钟时间;tomcat7下默认为10000毫秒
            ac.addListener(new AsyncListener() {
                public void onComplete(AsyncEvent event) throws IOException {

                    System.out.println("the event : " + event.toString() + " is complete now !");
                    publishService.remove(sid, event.getAsyncContext());
                }

                public void onTimeout(AsyncEvent event) throws IOException {
                    System.err.println("the event : " + event.toString() + " is timeout now !");

                    // 尝试向客户端发送超时方法调用,客户端会再次请求/blogpush,周而复始

                    //                String alertStr = "<script>comet.timeout();</script>";
                    //                writer.println(alertStr);
                    //                writer.flush();
                    //                writer.close();

                    publishService.remove(sid, event.getAsyncContext());
                    // 重新dispatch
                    event.getAsyncContext().dispatch();
                }

                public void onError(AsyncEvent event) throws IOException {

                    System.err.println(sid + "the event : " + event.toString() + " is error now !");
                    publishService.remove(sid, event.getAsyncContext());

                }

                public void onStartAsync(AsyncEvent event) throws IOException {
                    System.out.println("the event : " + event.toString() + " is Start Async now !");
                }
            });
        } catch (Exception e) {
            e.printStackTrace();
        }

    }

}

 

var comet = {
		showMsg : function(data) {
			//$("textarea").append(JSON.stringify(data)).append("<hr/>");
			if (console) {
				console.log(data);
			}
			if (data.name == 'question') {
				appendQuestion(data);
			} else {
				append(data);
			}
			scrollBottom('.lecture-main', '.lecture-main-wrap');

		},
		timeout : function() {
			$("#comet").attr("src",
					"/course/comet?sid=${subject.sid }&r=" + Math.random());

		}			
};

 

 

   注意事项:

 1 除了servlet 需要 配置 asyncSupported = true 外, filter 也需要配置

 <filter>
		<filter-name>characterEncodingFilter</filter-name>
		<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
		<async-supported>true</async-supported>
		<init-param>
			<param-name>encoding</param-name>
			<param-value>UTF-8</param-value>
		</init-param>
	</filter>

 2, 使用 iframe 请求一个长连接有一个很明显的不足之处:IE、Morzilla Firefox 下端的进度栏都会显示加载没有完成,而且 IE 上方的图标会不停的转动,表示加载正在进行。ie 解决方案

// we were served from child.example.com but 
  // have already set document.domain to example.com
  var currentDomain = "http://exmaple.com/"; 
  var dataStreamUrl = currentDomain+"path/to/server.cgi";
  var transferDoc = new ActiveXObject("htmlfile"); // !?!
  // make sure it's really scriptable
  transferDoc.open();
  transferDoc.write("<html>");
  transferDoc.write("<script>document.domain='"+currentDomain+"';</script>");
  transferDoc.write("</html>");
  transferDoc.close();
  // set the iframe up to call the server for data
  var ifrDiv = transferDoc.createElement("div");
  transferDoc.appendChild(ifrDiv);
  // start communicating
  ifrDiv.innerHTML = "<iframe src='"+dataStreamUrl+"'></iframe>";

 

3 tomcat comet 配置

 

Usage of these features requires using the APR or NIO HTTP connectors. The classic java.io HTTP connector and the AJP connectors do not support them,
实际是使用,需要增加对NIO的支持,要做的仅仅是在server.xml里边修改connector:

<connector protocol="org.apache.coyote.http11.Http11NioProtocol" port="8080" redirectport="8443" connectiontimeout="20000">

 

 <Connector 
            asyncTimeout="90000"
               port="8080" protocol="org.apache.coyote.http11.Http11NioProtocol"
               connectionTimeout="20000"
               redirectPort="8443" />

 

 

  参考资料:

http://www.ibm.com/developerworks/cn/web/wa-lo-comet

 

 http://www.cnblogs.com/haoxin_li/archive/2009/05/15/1457978.html

 

http://infrequently.org/2006/02/what-else-is-burried-down-in-the-depths-of-googles-amazing-javascript/

 



已有 0 人发表留言,猛击->> 这里<<-参与讨论


ITeye推荐



相关 [servlet3 comet http] 推荐:

基于Servlet3.0 comet http长连接

- - 互联网 - ITeye博客
基于 HTTP 长连接的“服务器推”技术. 浏览器作为 Web 应用的前台,自身的处理功能比较有限. 浏览器的发展需要客户端升级软件,同时由于客户端浏览器软件的多样性,在某种意义上,也影响了浏览器新技术的推广. 在 Web 应用中,浏览器的主要工作是发送请求、解析服务器返回的信息以不同的风格显示. AJAX 是浏览器技术发展的成果,通过在浏览器端发送异步请求,提高了单用户操作的响应性.

Comet:基于 HTTP 长连接的“服务器推”技术

- - k1121
转自:https://www.ibm.com/developerworks/cn/web/wa-lo-comet/. Ajax 技术资源中心,这是有关 Ajax 编程模型信息的一站式中心,包括很多文档、教程、论坛、blog、wiki 和新闻. 任何 Ajax 的新信息都能在这里找到. 订阅 Ajax 相关文章和教程的 RSS 提要.

spring mvc使用Servlet3异步要注意的几个问题

- - 企业架构 - ITeye博客
1、注意添加 true. 在web.xml中对DispatcherServlet添加true. 2、如果集成了shiro一定要注意在mapping中增加dispatcher项,否则会抛出org.apache.shiro.UnavailableSecurityManagerException异常.

商品详情页系统的Servlet3异步化实践

- - ITeye博客
在京东工作的这一年多时间里,我在整个商品详情页系统(后端数据源)及商品详情页统一服务系统(页面中异步加载的很多服务,如库存服务、图书相关服务、延保服务等)中使用了Servlet3请求异步化模型,总结了Servlet3请求异步化的一些经验和想法跟大家分享和交流. 我将从如下几点阐述Servlet3异步化之后的好处:.

反向Ajax,第1部分:Comet介绍

- 茫茫 - 译言-每日精品译文推荐
来源Reverse Ajax, Part 1: Introduction to Comet. web开发在过去的几年中有了很大的进展,我们已经远超了把静态网页链接在一起的做法,这种做法会引起浏览器的刷新,并且要等待页面的加载. 现在需要的是能够通过web来访问的完全动态的应用,这些应用通常需要尽可能的快,提供近乎实时的组件.

150行C代码的comet服务器

- - idea's blog
Comet 技术就是常见的 Web 服务器”推”技术, 用于向网页实时地推送数据. 最常见的 Comet 技术应用在网页聊天, 当然还可以应用于很多的方面, 如微博更新, 热点新闻推送, 股票即时行情等等, 甚至是网页游戏!. Comet 技术如此重要, 但市面上并没有真正流行通用的 Comet 服务器和解决方案, 比较知道的互联网公司大多是自己开发, 或者基于开源服务器进行二次开发, 例如基于 Jetty(一个开源 Java Web 容器), 而 Facebook 的聊天系统的 Comet 服务器是基于 Mochiweb(一个开源的 Erlang Web 服务器)..

comet 服务器 icomet 提供 Android API

- - 开源中国社区最新新闻
支持百万连接和 comet/push 服务器 icomet 日前提供了可用于 Android 移动开发的 Java API - iCometClient4j, 用于实现手机上的消息推送功能. 结合 icomet 的 HTTP endless chunk 模式, 可提供节省电池的长连接服务.. iCometClient4j项目地址: https://github.com/DuoZhang/iCometClient4j/.

HTTP Headers 入门

- johnny - Time Machine
非常感谢 @ytzong 同学在twitter上推荐这篇文章,原文在此. 本文系统的对HTTP Headers进行了简明易懂的阐述,我仅稍作笔记. 什么是HTTP Headers. HTTP是“Hypertext Transfer Protocol”的所写,整个万维网都在使用这种协议,几乎你在浏览器里看到的大部分内容都是通过http协议来传输的,比如这篇文章.

HTTP基础

- - ITeye博客
HTTP的结构主要包括下面几个要点:. HTTP的版本主要有1.0,1.1 和更高版本.    1.1 及以上版本允许在一个TCP连接上传送多个HTTP协议,1.0能 .    1.1 及以上版本多个请求和响应可以重叠,1.0不能.    1.1 增加了很多的请求头和响应头.     一个请求行,若干小心头,以及实体内容,其中的一些消息头和实体内容是可选的,消息头和实体内容需要空行隔开.

HTTP Header 详解

- - 博客园_Ruby's Louvre
HTTP(HyperTextTransferProtocol)即超文本传输协议,目前网页传输的的通用协议. HTTP协议采用了请求/响应模型,浏览器或其他客户端发出请求,服务器给与响应. 就整个网络资源传输而言,包括message-header和message-body两部分. 首先传递message- header,即 http header消息.