DWR 2.0 DEMO

yxwang0615

浏览: 559142 次
性别:
来自: 青岛

最近访客更多访客>>

javawang

nightwish12075

今天的耕耘明天的幸福

a617622010

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

DWR JavaScript Spring Servlet Ajax

DWR的工作原理：

DWR（Direct Web Remoting）是在Java EE中较流行的AJAX框架，它的最大优势就是可以像使用本地的Javascript函数一样，调用服务器上的Java方法。

其实DWR原理也不复杂，它先在web.xml中配置一个Servlet，映射到特定的路径（通常是%CONTEXT_PATH%/dwr/*）。这个Servlet的作用就是初始化要暴露给Javascript调用的Java类（通过dwr.xml进行配置），并生成相应的代理的Javascript类代码。在XHR请求到来的时候，Servlet负责将请求的参数变成对应的Java对象，并以其为参数调用目标Java方法，并将返回值转化为Javascript代码。详情请参考：http://getahead.ltd.uk/dwr/

了解了原理，下面就来说一下如何创建一个简单的DWR DEMO程序，步骤如下：

1.新建工程，导入dwr.jar;

2.在web.xml中插入：

 <!-- DWR2.0 BEGIN -->
   <servlet>
    <servlet-name>dwrInvoker</servlet-name>
    <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
    <init-param>
      <param-name>debug</param-name>
      <param-value>true</param-value>
    </init-param>
    <init-param>
        <param-name>classes</param-name>
    <param-value>java.lang.Object</param-value>
    </init-param>
      
      <load-on-startup>10</load-on-startup>
  </servlet>

  <servlet-mapping>
    <servlet-name>dwrInvoker</servlet-name>
    <url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>
  <!-- DWR2.0 END -->

3. 构建业务逻辑类和相关的实体：

User.java:

public class User implements Serializable{
	private int id;
	private String uname;
	private String upass;
                getter & setter...	
}

public class UserManager implements Serializable{
	
	public List getlist(){
		List users = new ArrayList();
		User u = null;
		for(int i = 0; i < 5; i++){
			u = new User();
			u.setId(i);
			u.setUname("name" + i);
			u.setUpass("pass" + i);
			System.out.println(i);
			users.add(u);
		}
		return users;
	}
	public boolean validate(String uname, String upass){
		if("admin".equals(uname)&& "admin".equals(upass)){
			return true;
		}
		return false; 
	}

4.在和web.xml同级的目录下，新建dwr.xml：

<?xml version="1.0" encoding="UTF-8"?>
<dwr>
<!-- AJAX技术具体实现 -->
    <allow>
       <!--convert将bean的集合变成javascript中的对象数组-->
        <convert  converter="bean" match="com.wyx.test.User"></convert>
        
<!-- 业务处理类 -->
<!-- 每个被调用的类都需要一个 <create> 来定义。有几种类型的creator，最常用的是“new”关键字和Spring框架
     Javascript是用于你在js中调用这个对象时使用什么名称，建议直接使用类名，这样一样就知道它对应哪个类 -->
        <create creator="new" javascript="UserManager" class="com.wyx.test.UserManager" scope="session">
			  <!--include则规定页面只能调用某些方法. exclude可以禁止页面调用后台的某个或某些方法 -->
			  <include method="getlist"/>
			  <include method="validate"/>	
        </create>        
   </allow>
</dwr>

说明：

（1）Creator是创建这个对象所使用的构建器，如果你希望使用传统的new方法就写成new，如果你希望使用spring来创建则写成spring，如果你使用了spring并且在creator中选择了spring，那么你需要一个叫beanName的参数，而其Value就是在spring配置文件中配置的beanName.

<create creator="spring" javascript="UserManager"   class="com.wyx.test.UserManager" scope="session">
         <param name="beanName" value="departmentBus"/>
</create>

（2）converter常用的可选值:bean、object、hibernate2、hibernate3 ，match用于告诉DWR你将需要把java中的哪些类转换成js。

5.在页面中使用DWR帮我们生成的代理JavaScript：

index.jsp：

<!--导入脚本-->
<script type="text/javascript" src="/mydwr/dwr/interface/UserManager.js"></script>
	<script type="text/javascript" src="/mydwr/dwr/engine.js"></script>
	<script type="text/javascript" src="/mydwr/dwr/util.js"></script>

<!--创建script脚本-->
<script type="text/javascript">
  	function getlist(){
  		//alert("aaa");
  		UserManager.getlist(callback1);
  	}
 	function validate(){
 		var uname = document.getElementById("txt_name").value;
 		var upass = document.getElementById("txt_pass").value;
 		UserManager.validate(uname, upass, callback2);
  	}
  	function callback1(data){
  		
  		var innerStr = "id   user   pass<br/>";
  		for(var i = 0; i< data.length; i++){
  			innerStr += data[i].id + "   " + data[i].uname + "   " + data[i].upass + "<br>"; 
  			DWRUtil.setValue("mydiv",innerStr);
  		}
  		//document.getElementById("mydiv").innerHTML = innerStr;
  	}
  	function callback2(data){
  		if(data){
  			alert("your loing messages are right!");
  		}else{
  			alert("sorry , your messages are wrong!");
  		}
  	}
  </script>

<!--使用脚本-->

<body>
    uname: <input id="txt_name" type="text" /><br>
    upass: <input id="txt_pass" type="password" /><br>
      <input type="button" value="longin" onclick="validate()"><br>
      <input type="button" value="getlist" onclick="getlist()">
    <div id="mydiv"></div>

JavaScript方法的最后一个参数是回调函数的方法名字，不要连回调方法的参数也写上，仅仅是名字。

util.js包含了一些使用的方法，从而帮助你利用javascript(可能)从服务器端更新你的web数据。你可以在DWR之外的地方使用它，因为它并不依赖与DWR而实现。它包含四个页面处理函数：

1 getText()作用于select lists。
2 getValue[s]()、setValue[s]()作用于除tables、lists和images以外的大多数html元素。
3 addRows()和removeAllRows()用于编辑tables。
4 addOptions()和removeAllOptions()用于编辑lists(如：select lists、ul、ol)。

再具体的可以从http://www.uml.org.cn/AJAX/200812222.asp了解。

engine.js对于DWR来说是至关重要的,因为它被动态生成的接口j avascript函数所调用,因此在使用DWR的地方都必须使用它.所有使用DWR的页面都需要加入下面代码来导入这个DWR主引擎:

<script type='text/j avascript'
   src='/[YOUR-WEB-APP]/dwr/engine.js'>
</script>

dwr.engine._execute is not a function???

发表评论

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

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

DWR 2.0 DEMO

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

DWR 2.0 DEMO

评论

发表评论

相关推荐

DWR笔记

最近访客更多访客>>