ajax dwr入门介绍

DWR  ---   Direct Web Remoting


DWR介绍
What is DWR?：
在服务器上运行的Servlet来处理请求并把结果返回浏览器。

运行在浏览器上的Javascript，可以发送请求，并动态 改变页面。DWR会根据你的Java类动态的生成Javascript代码。这些代码魔力是让你感觉整个Ajax调用都是在浏览器上发生的，但事实上是服务器执行了这些代码，DWR负责数据的传递和转换。

这种Java和Javascript之间的远程调用会让DWR用
户感觉像是曾经习惯使用的RMI或SOAP的RPC机制。而且这一过程还不需要额外的浏览器插件。
Java是同步的，而Ajax是异步的。所以当你调用一个远程方法时，你要给DWR一个回调函数，当数据从网络上回来时,DWR会调用这个函数。

DWR的作用:
有效地从应用程序代码中把 Ajax 的全部请求-响应循环消除掉。
客户端代码再也不需要直接处理XMLHttpRequest 对象或者服务器的响应。
不再需要编写对象的序列化代码或者使用第三方工具才能把对象变成 XML。
不再需要编写 servlet 代码把 Ajax 请求调整成对 Java 域对象的调用


DWR原理

DWR是作为Web应用的一个Servlet进行部 署的，是一个黑盒子中的servlet。

对于公共有的每个类，DWR 动态地生成包含在 Web 页面中的 JavaScript。生成的JavaScript 包含存根函数，代表 Java 类上的 对应方法并在幕后执行XMLHttpRequest。这些请求被发送给DWR。

把请求翻译成服务器端 Java 对象上的方法调用并把方法的返回值放在servlet 响应中发送回客户端，编码成 JavaScript。


DWR开发步骤

修改web.xml,新增 DwrServlet

<servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>
            org.directwebremoting.servlet.DwrServlet
        </servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
    </servlet>
 
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>

编写服务器端Java类

不要出现Javascript保留关键字；和保留关键字同名的函数指定被排除。
多数Javascript的关键字和Java是相同的。所以你不可能有一个方法叫做”try()”。但是该死”delete()”对与Javascript有着特殊意义，而对Java则不是。

Javascript方法重载是不支持的，所以尽量不要再Java中使用。

 
package com.ray.dwr;
 
public class HelloWorld {
    public String sayHello(String name) {
        return "Hi, " + name;
    }
}

在dwr.xml文件注册Java对象

<dwr>
    <allow>
        <create creator="new" javascript="HelloWorld" scope="page">
            <param name="class" value="com.ray.dwr.HelloWorld" />
            <include method="sayHello" />
        </create>
    </allow>
</dwr>

或者

<dwr>
    <allow>
        <create creator="spring" javascript="HelloWorld" > //javascript是指动态生成的javascript的文件名
            <param name="bean" value="helloWorld" />
            <include method="sayHello" />
        </create>
    </allow>
</dwr>
//第二种情况下 需要在spring 配置文件中配置一个
  <bean name="helloWord" class="com.ray.dwr.HelloWorld" /> 

如果include 不配置那么 HelloWorld类对象的所有方法都可以被执行。



在jsp页面中添加DWR AJAX库以及相应的js

注:  可以在启动项目后,IE地址栏输入 http://hostName:port/dwr/
    查看动态javascript 路径.以及所有可以运行的方法.

<script src='/dwr/engine.js'>
</script> 
<script src='/dwr/util.js'>
</script> 
<script src='/dwr/interface/HelloWorld.js'>
</script>

DWR核心引擎engine.js

页面中加入:

<script type='text/javascript' src='dwr/engine.js' />
设置超时时间:

全局设置:
dwr.engine.setTimeout(1000);
局部设置(优先级高):
Remote.singleMethod(params, { callback:function(data)
{ ... }, timeout:2000 });


错误处理:
全局设置:
function handler(msg) {
alert(msg);
}
dwr.engine.setErrorHandler(handler);
局部设置:
Remote.method(params, {
callback:function(data) { ... },
errorHandler:handler
});


批量执行 :
dwr.engine.beginBatch();
var selValue=…;
//调用服务器Java程序
Province.getCitiesByProvince(selValue,callBack);
Province.getNick(callBack2);
dwr.engine.endBatch({
timeout:3000
});
//…



DWR工具包
    必须在页面引入util.js
    <script src='dwr/util.js'>
    </script>

1、$(”username”) = document.getElementById(”username”);
2、setValue(id, value):这个函数能操作大多数HTML元素
3、getValue(id):getValue(id)是 setValue()对应的”读版本”。
4、setValues():批量设置值
5、getValues():批量获取值
6、getText(id):为select列表设计的。你可能需要取得显示的文字,而不是当前选项的值。
7、selectRange:选择一个输入框中的一定范围的文字。
……