A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© sunhaoz 中级黑马   /  2013-8-7 22:25  /  2715 人查看  /  2 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

DWR(Direct Web Remoting)是一个用于改善web页面与Java类交互的远程服务器端Ajax开源框架,可以帮助开发人员开发包含AJAX技术的网站。它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数,就像它就在浏览器里一样。
首先创建一个 SSH项目  将  struts.xml   applicationContext.xml 都编写好 架子都搭起来

使用dwr框架 就需要先导入它的 jar架包

http://directwebremoting.org/dwr/  到这里下载
commons-logging-1.1.1.jar
dwr.jar

导入架包之后


在项目中的 web.xml中 加入 dwr的servlet
<servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>uk.ltd.getahead.dwr.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>

同在 WEB-INF中创建 一个 名为  dwr的  xml文件

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC
    "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN"
    "http://getahead.org/dwr/dwr30.dtd">

<dwr>
        <allow>
                <!-- creator中 可以填写 none表示不创建对象  new 通过默认构造函数进行创建对象   我这里集成spring 所以写spring表示通过Srping框架访问bean      javascript中填写的名称 就是js在调用java对象时所使用的名称 可以把它看成是java对象的一个引用名 -->
                <create creator="spring" javascript="JgetList" >
                <!-- 用来指定创建器的参数  其中name属性用来指定参数名称  value用来指定参数的值 -->
                        <param name="beanName" value="personAction"></param>
                </create>
                <!-- 类型转换器
                        用于定义java类型和javascript 类型之间的对应关系
                        对于普通的情形 无需显示指定转换器 DWR已经提供了简单类型的转换器
                        DWR默认支持的类型如下:
                        所有基本类型  boolean  int  double 等。
                        包装类   Boolean  Integer。
                        java.lang.String。
                        日期类型: java.util.Date    java.sql.Times   java.sql.Timestamp等
                        数组(存放以上类型)
                        集合类型:  如 List  Set Map  Iterator  等(存放以上类型)
                       
                 -->
                <convert match="com.dwr.entity.Person" converter="bean">
                </convert>
        </allow>
</dwr>


将配置文件搞定之后    发布项目 运行起来之后  在地址栏输入 http://localhost:8080/DWRTest/dwr   (因为在web.xml中配置了DWR的servlet访问路径 为 /dwr/*)
会在页面看到如下界面


点击 JgetList 连接  (JgetList就是我们在dwr.xml中定义的那个  javascript的名字 )
进入之后 界面如下





其中 我们需要用到的 就是 最上面那两段  script 脚本
<script type='text/javascript' src='/DWRTest/dwr/engine.js'></script>   
engine.js对dwr非常重要 他是dwr客户端的核心  用来把动态生成的javascript对象转换为服务器上的java对象 所以只要用到dwr的地方就需要他 该函数库可用于设置一些dwr的全局属性   下面介绍一些常用的:
设置超时:  dwr.engine.setTimeout(time);//以毫秒为单位设置请求超时的时间
设置请求的方法:dwr.engine.setHttpMethod(method);//该方法只能设置两个值  get  和 post
设置调用顺序:dwr.engine.setOrdered(boolean);  //ajax通常都是异步调用 但是服务器相应的顺序和与调用的顺序往往不同 所以可以通过将它设置为true   dwr将保证请求的顺序与服务器相应的顺序一致

<script type='text/javascript' src='/DWRTest/dwr/interface/JgetList.js'></script>
这就是dwr根据我们的配置文件 为我们动态生成的javascript脚本


<script type='text/javascript' src='/DWRTest/dwr/util.js'></script>
util.js中包含了一些工具函数   可以通过这些函数 简化javascript 的操作  (不过我一般不用  , 一般都用jQuery)。
util.js文件与dwr框架关系不是特别大  可以在任何不同的网页中使用  即便该工程并没有使用dwr

开始编写代码
那我的举例 我调用的是 action中的一个 模糊查询方法 (因为我做的是一个自动补全功能)

         public List<Person> findBySearc(String src)
         {
                 return personBiz.findBySearch(src);
         }


编写好java类之后 下面开始在页面上做工作了

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type='text/javascript' src='/DWRTest/dwr/engine.js'></script>
<script type='text/javascript' src='/DWRTest/dwr/interface/JgetList.js'></script>
<script type="text/javascript">
//这个function 直接对java对象进行操作
function callTestGetList()
{
        document.getElementById("ul").innerHTML = '';
        var datas = document.getElementById("search").value;
        if(datas != '')
        {
                //JgetList就是我们定义在dwr.xml中的javascript的值
                // findBySearch 就是定义在java类中的方法的名字
                //其中datas是需要传入方法中的值  也就是java方法所需要的参数
                //callBackForGetList 是我们的回调函数
                //如果没有需要传入的参数的话  括号内直接写回调函数的函数名
                JgetList.findBySearc(datas,callBackForGetList);
        }
       
}
//回调函数
function callBackForGetList(data)
{
        for(var i = 0; i<data.length; i++)
        {
                var _li = document.createElement('li');
                //这里的 data.name data是通过java方法查询到的List集合 已经通过回调函数返回给callBackForGetList 的 形参 data了
                //通过 对象名.属性  便可获取到其中的值
                _li.innerHTML = data.name;
                document.getElementById("ul").appendChild(_li);
                       
               
        }
}

</script>

</head>
<body>

<input type="text" id="search"/>
<div id="list">
<ul id="ul">
</ul>
</div>
</body>
</html>



如果 进入  http://localhost:8080/DWRTest/dwr   出现404错误的话  请检查dwr.xml  和 web.xml 配置文件 查看配置是否配置有误


评分

参与人数 1技术分 +1 黑马币 +3 收起 理由
Sword + 1 + 3 赞一个!

查看全部评分

2 个回复

倒序浏览
希望你能每天坚持来黑马论坛,坚持签到、坚持提问问题和回答问题 !技术分不是问题!加油!
回复 使用道具 举报
Sword 发表于 2013-8-7 23:41
希望你能每天坚持来黑马论坛,坚持签到、坚持提问问题和回答问题 !技术分不是问题!加油! ...

恩恩 开始不清楚 现在知道了.
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马