dwr reverse-ajax 实例解析

在网上找了一个老外写的dwr  reverse-ajax的例子，自己把coding顺序调整了一下希望可以对学习dwr reverse-ajax的朋友有所帮助
1、首先要下载dwr 2.0 地址 http://getahead.org/dwr/download
2、在web.xml中加入dwr的servlet和相关配置

  <!-- dwr servlet -->
   < servlet >
     < servlet-name > dwr-invoker </ servlet-name >
     < display-name > DWR Servlet </ display-name >
     < servlet-class > uk.ltd.getahead.dwr.DWRServlet </ servlet-class >
     < init-param >
         < param-name > debug </ param-name >
         < param-value > true </ param-value >
     </ init-param >
       < init-param >
       < param-name > pollAndCometEnabled </ param-name >
       < param-value > true </ param-value >
     </ init-param >
     < load-on-startup > 1 </ load-on-startup >       
   </ servlet >
   < servlet-mapping >
       < servlet-name > dwr-invoker </ servlet-name >
       < url-pattern > /dwr/* </ url-pattern >
   </ servlet-mapping >

pollAndCometEnabled是指dwr 的reverse ajax是使用polling 和comet的方式，在这个例子中可以明显地从页面上看出来是用的polling+comet
附：关于reverse-ajax的实现有3种方式
polling   就是隔一段时间向服务器发送一request来检查服务端是否有数据更新
comet   就是一个长http请求，在请求期间服务端可以向客户端push数据，但是这种做法要求server和brower长期建立一个通信通道，而且效率很低
piggyback 就是服务端的更新数据都在排队等待，等到下一次有请求过来，那么这些等待更新数据就伴随这次请求一起发送到brower
有关更详细的reverse-ajax技术介绍可以参考 http://getahead.org/dwr/reverse-ajax
3、创建一个dwr.xml，用于配置你要制定的java代码映射类，以及允许使用的方法和converter

<? xml version="1.0" encoding="UTF-8" ?>
<! DOCTYPE dwr PUBLIC
    "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
    "http://www.getahead.ltd.uk/dwr/dwr10.dtd" >
< dwr >
   < allow >
     < create  creator ="new"  javascript ="DWRHelper" >
       < param  name ="class"  value ="com.cloverworxs.uma.helper.DWRHelper"   />
       < include  method ="addMessage"   />
     </ create >
         < convert  converter ="bean"  match ="com.cloverworxs.uma.helper.Message" >
       < param  name ="include"  value ="id,text"   />
     </ convert >
   </ allow >
</ dwr >

create是只一个java的js映射，其中include是可以在js使用的方法
convert 是指对应js到java，或者java到js的对象转换，其中include是可以转换的属性
4、写服务段的java代码
DWRHelper

package  com.cloverworxs.uma.helper;

import  java.util.ArrayList;
import  java.util.Collection;
import  java.util.Iterator;
import  java.util.LinkedHashMap;
import  java.util.LinkedList;
import  java.util.List;
import  java.util.Map;

import  org.directwebremoting.ScriptBuffer;
import  org.directwebremoting.WebContext;
import  org.directwebremoting.WebContextFactory;
import  org.directwebremoting.proxy.dwr.Util;

public   class  DWRHelper  {
     
    public void addMessage(String text) {
        LinkedList messages = new LinkedList();

        if (text != null && text.trim().length() > 0) {
            messages.addFirst(new Message(text));
            while (messages.size() > 10) {
                messages.removeLast();
            }
        }
        // Reverse Ajax code to be added here shortly
        WebContext wctx = WebContextFactory.get();
        String currentPage = wctx.getCurrentPage();

        // Clear the input box in the browser that kicked off this page only
        Util utilThis = new Util(wctx.getScriptSession());
        utilThis.setValue("text", "");

        // For all the browsers on the current page:
        Collection sessions = wctx.getScriptSessionsByPage(currentPage);
        Util utilAll = new Util(sessions);
        // Clear the list and add in the new set of messages
        utilAll.removeAllOptions("chatlog");
        utilAll.addOptions("chatlog", messages, "text");

    }
   
}

Message

package  com.cloverworxs.uma.helper;

import  org.directwebremoting.Security;

public   class  Message  {
    public Message(String newtext) {
        text = newtext;
        if (text.length() > 256) {
            text = text.substring(0, 256);
        }
        text = Security.replaceXmlCharacters(text);
    }

    public long getId() {
        return id;
    }

    public String getText() {
        return text;
    }

    private long id = System.currentTimeMillis();

    private String text;
}

5、到此为止可以写页面代码了，下面的代码html或者jsp都可以

< h1 > Java Chat </ h1 >
< body  onload ="dwr.engine.setActiveReverseAjax(true);" >
< script  type ='text/javascript'  src ='/sperc/dwr/interface/DWRHelper.js' ></ script >
< script  type ='text/javascript'  src ='/sperc/dwr/engine.js' ></ script >
< script  type ='text/javascript'  src ='/sperc/dwr/util.js' ></ script >
< p > This is a very simple chat demo that uses reverse ajax to collect messages and server-side browser manipulation to update the pages with the results. </ p >
< p > Your Message:  < input  id ="text"  onkeypress ="dwr.util.onReturn(event, sendMessage)"   />   < input  type ="button"  value ="Send"  onclick ="sendMessage()"   /></ p >
< script  type ="text/javascript" >
    function sendMessage() {
      alert(dwr.util.getValue("text"));
      DWRHelper.addMessage(dwr.util.getValue("text"));
    }
</script>
<hr />
<ul id="chatlog" style="list-style-type:none;">
</ul>
</body>

页面代码简单吧，只有方法调用，没有任何获得返回数据，和对回传数据处理的代码
注意： < body  onload ="dwr.engine.setActiveReverseAjax(true);" >
这个是要在使用reverse-ajax的页面必须的！
现在可以启动应用体检一把reverse-ajax，希望你能和我有一样的惊奇感觉
当然，肯定有人会说这种功能用普通的ajax也可以实现啊，为什么要用reverse-ajax
这时候你就要考虑这种情况了，有用户A和用户B同时在发Message，A正在看message没有任何request动作，而B发了一条新message，这时要求这个信息要展现给A看，那么普通的ajax可以处理这种功能吗？这就是reverse-ajax的用途，可以从服务段向brower下推信息

rocket 2007-05-19 14:48 发表评论