DWR框架搭建以及使用

末蓝、 2022-06-14 05:53 515阅读 0赞

1,DWR介绍

DWR(Direct Web Remoting)是一个用于改善web页面与Java类交互的远程服务器端Ajax开源框架,可以帮助开发人员开发包含AJAX技术的网站。它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数,就像它就在浏览器里一样。

它包含两个主要的部分:允许JavaScript从WEB服务器上一个遵循了AJAX原则的Servlet中获取数据.另外一方面一个JavaScript库可以帮助网站开发人员轻松地利用获取的数据来动态改变网页的内容.

2,安装配置

2.1安装dwr.jar包和commos-loggings.jar包

dwr.jar包是DWR框架的核心包。可在官网下载:

地址:http://directwebremoting.org/dwr/downloads/index.html

Center

dwrdemo.war是官方提供的参考war包,有基本DWR框架的配置,也有dwr.jar包和commos-loggings.jar包。

2.2 配置wel.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!DOCTYPE web-app PUBLIC
  3. "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
  4. "http://java.sun.com/dtd/web-app_2_3.dtd">
  5. <web-app id="dwr">
  6. <servlet>
  7. <servlet-name>dwr-invoker</servlet-name>
  8. <display-name>DWR Servlet</display-name>
  9. <description>Direct Web Remoter Servlet</description>
  10. <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
  11. <init-param>
  12. <param-name>debug</param-name>
  13. <param-value>true</param-value>
  14. </init-param>
  15. </servlet>
  16. <servlet-mapping>
  17. <servlet-name>dwr-invoker</servlet-name>
  18. <url-pattern>/dwr/*</url-pattern>
  19. </servlet-mapping>
  20. </web-app>

规定这样配置,复制即可。

注意:/dwr/*中的dwr就是页面(下图)的src路径中dwr。

Center 1

2.3 dwr.xml配置

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
  3. <dwr>
  4. <allow>
  5. <!--配置的一个演示类,javascript="test" 表示可以在页面中用test这个名称指向DwrTest这个java类,类中的方法可以在前台调用 -->
  6. <!-- creater="new"表示每调用一次时,都需要new一个 -->
  7. <create creator="new" javascript="test">
  8. <param name="class" value="com.dwr.DwrTest" />
  9. </create>
  10. <!-- 配置javaBean类 -->
  11. <convert match="com.dwr.User" converter="bean"/>
  12. </allow>
  13. </dwr>

dwrdemo.war包中有配置模板,可以复制过来做修改即可。

2.4 jsp页面配置

Center 2

jsp页面如果要使用DWR框架,需提交上图的代码,src路径中的dwr是web.xml文件中/dwr/*节点的dwr. engine.js,util.js,interface是规定格式,test是dwr.xml配置文件javascript属性的值test。

以下是dwr.xml配置的补充,了解即可。

标签是dwr中重要的标签,用来描述java(服务器端) 与javascript (客户端)的交互方式。其基本格式如下:

  1. <allow>
  2. <create creator="..." javascript="..." scope="...">
  3. <param name="..." value="..."/>
  4. <auth method="..." role="..."/>
  5. <exclude method="..."/>
  6. <include method="..."/>
  7. </create>
  8. ...
  9. </allow>

creator属性 是必须的 -它用来指定使用那种创造器。

默认情况下DWR1.1有8种创造器。它们是:

· new: 用Java的new关键字创造对象。

· none: 它不创建对象,看下面的原因。 (v1.1+)

· scripted: 通过BSF使用脚本语言创建对象,例如BeanShell或Groovy。

· spring: 通过Spring框架访问Bean。

· jsf: 使用JSF的Bean。 (v1.1+)

· struts: 使用Struts的FormBean。 (v1.1+)

· pageflow: 访问Beehive或Weblogic的PageFlow。 (v1.1+)

如果你需要写自己的创造器,你必须在init部分注册它。

javascript属性 用于指定浏览器中这个被创造出来的对象的名字。你不能使用Javascript的关键字。

scope属性 非常类似servlet规范中的scope。它允许你指定这个bean在什么生命范围。选项有”application”, “session”, “request” 和”page”。这些值对于Servlet和JSP开发者来说应该相当熟悉了。

scope属性是可选的。默认是”page”。如果要使用”session”需要cookies。当前的DWR不支持ULR重写。

param元素 被用来指定创造器的其他参数,每种构造器各有不同。例如,”new”创造器需要知道要创建的对象类型是什么。每一个创造器的参数在各自的文档中能找到。请查看上面的链接。

include和exclude元素 允许创造器来限制类中方法的访问。一个创造器必须指定include列表或exclude列表之一。如果是include列表则暗示默认的访问策略是”拒绝”;如果是exclude列表则暗示默认的访问策略是”允许”。

例如要拒绝防范除了setWibble()以外的所有方法,你应该把如下内容添加到dwr.xml中。

对于加入到create元素中的类的所有方法都是默认可见的。

auth元素 允许你指定一个J2EE的角色作为将来的访问控制检查:

3,DWR的简单使用

3.1 java DWR实现类DwrTest

package com.dwr; import java.util.List; import java.util.Map; /*** * DWR的实现类 * @author ZhongBingLin * */ public class DwrTest { /** * * @param list 存有实体类User对象的list对象 页面传过来的值 * @return list 存有实体类User对象的list对象 在页面可以得到 */ public List<User> list(List<User> list) { for (User user : list) { System.out.println(user.toString()); } return list; } /** * * @param map Map<String,User>对象 页面传过来的值 * @return map Map<String,User>对象 在页面可以得到 */ public Map<String,User> map(Map<String,User> map) { for (String str: map.keySet()) { System.out.println(str+","+map.get(str).toString()); } return map; } }

3.2 javaBean类User

  1. package com.dwr;
  2. public class User {
  3. private int id;
  4. private String name;
  5. private String addr;
  6. public int getId() {
  7. return id;
  8. }
  9. public void setId(int id) {
  10. this.id = id;
  11. }
  12. public String getName() {
  13. return name;
  14. }
  15. public void setName(String name) {
  16. this.name = name;
  17. }
  18. public String getAddr() {
  19. return addr;
  20. }
  21. public void setAddr(String addr) {
  22. this.addr = addr;
  23. }
  24. public String toString() {
  25. return "[id=" + id + ", name=" + name + ", addr=" + addr + "]";
  26. }
  27. }

3.3 Jsp页面 test.jsp

  1. <%@ page language="java" contentType="text/html; charset=utf-8"
  2. pageEncoding="utf-8"%>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  4. <html>
  5. <head>
  6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  7. <title>dwr test</title>
  8. <script type="text/javascript" src="<%=request.getContextPath()%>/dwr/engine.js"></script>
  9. <script type="text/javascript" src="<%=request.getContextPath()%>/dwr/util.js"></script>
  10. <script type="text/javascript" src="<%=request.getContextPath()%>/dwr/interface/test.js"></script>
  11. </head>
  12. <script type="text/javascript">
  13. function list()
  14. {
  15. var a = {id:1,name:"肖亮亮",addr:"湖南永州"};
  16. var b = {id:2,name:"唐为强",addr:"广东深圳"};
  17. test.list([a,b],function(userList)
  18. {
  19. for(var i=0;i<userList.length;i++){
  20. alert("id="+userList[i].id+",name="+userList[i].name+",addr="+userList[i].addr);
  21. }
  22. });
  23. }
  24. function map()
  25. {
  26. var a = {id:1,name:"肖亮亮",addr:"湖南永州"};
  27. var b = {id:2,name:"唐为强",addr:"广东深圳"};
  28. test.map({"id1":a,"id2":b},function(userMap){
  29. for(var key in userMap){
  30. alert(key+": "+userMap[key].id+","+userMap[key].name+","+userMap[key].addr);
  31. }
  32. });
  33. }
  34. </script>
  35. <body>
  36. <button οnclick="list()">list</button>
  37. <button οnclick="map()">map</button>
  38. </body>
  39. </html>

3.4页面效果

图1:

Center 3

图2:

Center 4

页面点击list按钮触发事件,js中test对象调用了DwrTest类的list方法,打印图1效果,传了一个参数list对象,返回值userList传入回调函数,在函数中跳出图效果。

点击map按钮有类似效果,这里就不再描述了。

发表评论

表情:
评论列表 (有 0 条评论,515人围观)

还没有评论,来说两句吧...

相关阅读