AJAX技术之DWR框架入门

 (1) 简介官方：http://directwebremoting.org/dwr/download最新版本：2.0.5DWR (Direct Web Remoting)是getahead公司开发的一个实现AJAX应用的框架。DWR是一个可以允许你去创建AJAX WEB站点的JAVA开源库。它可以让你在浏览器中的Javascript代码调用Web服务器上的Java代...

iteye_3898

100人浏览 · 2009-04-06 22:47:08

iteye_3898 · 2009-04-06 22:47:08 发布

(1) 简介

官方：http://directwebremoting.org/dwr/download

最新版本：2.0.5

DWR (Direct Web Remoting)是getahead公司开发的一个实现AJAX应用的框架。

DWR是一个可以允许你去创建AJAX WEB站点的JAVA开源库。它可以让你在浏览器中的Javascript代码调用Web服务器上的Java代码，就像在Java代码就在浏览器中一样。 DWR包含2个主要部分：

 一个运行在服务器端的Java Servlet，它处理请求并且向浏览器发回响应。

 运行在浏览器端的JavaScript，它发送请求而且还能动态更新网页。

DWR工作原理是通过动态把Java类生成为Javascript。它的代码就像Ajax魔法一样，你感觉调用就像发生在浏览器端，但是实际上代码调用发生在服务器端，DWR负责数据的传递和转换。这种从Java到JavaScript的远程调用功能的方式使DWR用起来有种非常像RMI或者SOAP的常规RPC机制，而且DWR的优点在于不需要任何的网页浏览器插件就能运行在网页上。 Java从根本上讲是同步机制，然而AJAX却是异步的。所以你调用远程方法时，当数据已经从网络上返回的时候，你要提供有反调（callback）功能的DWR。

DWR动态在JavaScript里生成一个AjaxService类，去匹配服务气端的代码。由eventHandler去调用它，然后DWR处理所有的远程细节，包括倒置（converting）所有的参数以及返回Javascript和Java之的值。在示例中，先在eventHandler方法里调用AjaxService的getOptions() 方法，然后通过反调（callback）方法populateList(data) 得到返回的数据，其中data就是String[]{"1", "2", "3"}，最后再使用DWR utility 把data加入到下拉列表。好了，DWR介绍完了，现在大家肯定很想知道如何做出第一个DWR吧！然后我们在下一章节以一个HelloWorld示例带领大家入门。

(2) DWR 之Hello World入门

步骤：

l 新建工程，从官方网站下载dwr.jar包。然后将它放在你webapp的WEB-INF/lib目录下。

l 编辑配置web.xml文件加入以下配置：

<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>

l 编写serivce类

package com.dwrdemo;

/**
 * @deprecated: 
 * @author: vince
 * @version 1.0
 * @email finally_m@yahoo.cn
 */
public class Demo{
	public String sayHello(String name) {
		return "Hello, " + name;
	}
}

l 在web.xml的同一目录下，创建dwr.xml，并且将要被调用的java类写入其中

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd"> 
<dwr> 
	<allow> 
		<create creator="new" javascript="Demo"> 
			<param name="class" value="com.dwrdemo.Demo" />
		</create>
	</allow> 
</dwr>

l 编写JSP测试页面

<1 引用dwr自动生成的js，dwr/interface/service.js，注意js名字要和dwr.xml配置的一样

<2 js里的service.sayHello和java类的那个有一点区别，多了个参数，用来callback返回的

数据

<script type="text/javascript" src="<%=path%>/dwr/util.js"></script>
<script type="text/javascript" src="<%=path%>/dwr/engine.js"></script>
<script type='text/javascript' src='<%=path%>/dwr/interface/Demo.js'></script>

<script type="text/javascript">   
function update() {    	
var name = dwr.util.getValue("demoName");    	
Demo.sayHello(name,function(data){

dwr.util.setValue("demoReply",data);    	
});      
}
</script>

<body>
	<h2>示例</h2>
	<p>
		Name:<input type="text" id="demoName" />
		<input value="Send" type="button" οnclick="update()" />
		<br />
		Reply:span id="demoReply"></span>
	</p>

</body>

<参考示例代码>