DWR的入门实例

yangjinhappy

浏览: 156406 次
性别:
来自: 上海

最近访客更多访客>>

注孤一掷

1988xuxuxu

a1053646895

hao123456438

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

DWR JavaScript Servlet 浏览器 Spring

DWR是作为远程调用的ajax框架，将服务端的java类，方法和浏览器的javascript的类，方法对应起来。现在官方最新的版本是DWR2.0，可以在http://getahead.ltd.uk/dwr/download下载到。

新建一个web项目DWRStudy，在项目中构建路径中加入dwr.jar，新建类Hello如下：

package org.li.dwr;
package org.li.dwr;
import java.util.Date;
public class Hello
{
public String getHelloWorld()
{
return "现在的时间为："+new Date();
} }

在WEB-INF目录下新建dwr.xml文件：

代码

<?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 javascript="jshello" creator="new" scope="application">
<param name="class" value="org.li.dwr.Hello"></param>
</create>
</allow>
</dwr>

在WebRoot目录里新建hello.js

代码

function load()//载入的时候调用
{
var jbutton = document.getElementById("jbutton");
jbutton.onclick=function(event)//注册按钮点击事件
{
jbClick();
};
}
function jbClick()//按钮点击事件
{
jshello.getHelloWorld(callback);//没有参数传递，只传递回调函数就行
}
function callback(msg)//回调函数
{
DWRUtil.setValue('jdiv',msg);
}

在WebRoot目录里新建HelloWorld.html

代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>HelloWorld.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type='text/javascript' src='dwr/interface/jshello.js'></script>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type="text/javascript" src="hello.js"></script>
</head>
<body>
<input id="jbutton" type="button" value="得到Hello World"/>
<div id="jdiv"></div>
<script>load()</script>
</body>
</html>

在web.xml中加入一个dwr的servlet：

代码

<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>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>

　　　　在运行一下服务器在浏览器里输入http://localhost:8080/DWRStudy/HelloWorld.html，然后点一下按钮下面就会显示服务端的系统时间了，而浏览器页面并没有被刷新。
下面解释一下：

1. 新建的Hello类中有一个getHelloWorld方法这个方法就是作为远程调用的服务端方法，这个Hello类也就是远程调用的类。方法的返回值为服务端当前的时间

2. dwr.xml是DWR用来配置服务端类和浏览器端javascript类之间的映射。可以下载dtd看一下，在<allow></allow>里类配置映射类如：
<create javascript="jshello" creator="new" scope="application">
<param name="class" value="org.li.dwr.Hello"></param>
</create>

　　　javascript="jshello"是在浏览器端的javascript的映射的类名，（不要用javascript里的关键字）creator="new"是表示这个类是dwr自己创建的，如果creator="new"那么就必须有下面的<param name=”class” value=”类的全路径”></param>，creator还可为spring(与spring集成的时候),script(与apache的一个框架BSF集成的时候用),后来又加入了struts,jsf,ejb3.现在是个HelloWorld让大家体验一下，具体后面会细讲。最后的scope=”application”是说这个pojo类的范围，和jsp是一样的。

3. 创建hello.js和HelloWorld.html都是看自己是怎么发挥了，注意的是在HelloWorld.html中导入js文件的时候注意顺序和路径命名规律，自己发挥的这个hello.js一定放在后面，因为要调用其它js文件中的函数。由于在HelloWorld.html里写入了<script>load()</script>所以在html加载的时候会调用hello.js里的load方法(注意这几个js文件里的函数最好不要重名)在load里面做的事情就是注册一下id为jbutton的按钮的点击事件。当我们点击id为jbutton的按钮的时候就开始用与服务器端的类相对应的javascript类了（jshello），直接调用jshello类的getHelloWorld方法，可以向函数传递参数，不过要在最后加一个回调函数。而我们的服务端的类没有参数就直接传回调函数了。在回调函数的形参msg是服务端Hello类中getHelloWorld方法返回值。在回调函数里面调用了DWR的工具类DWRUtil类的setValue方法设置id为jdiv的值。另外我们把doucment.getElementById(“jbutton”);换与$(“jbutton”)也可以得到同样的效果，这就有点像prototype了。

4. 在web.xml里加入DWRServlet的配置一是为了远程调用，二是自动生成了：
<script type='text/javascript' src='dwr/interface/jshello.js'></script>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>文件。

分享到：

Ajax的开源项目DWR的入门指导 | java中四种操作（DOM、SAX、JDOM、DOM4J ...

2008-03-13 15:05
浏览 919
评论(1)
论坛回复 / 浏览 (1 / 2207)
分类:非技术
查看更多

1 楼 aidiyuxin 2008-05-27

不错不错
到了新公司，大家都用这个，学习下哈

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论