DWR框架对于Ajax的轻量级使用

来源:互联网 发布:76.164.232.68indx.php 编辑:程序博客网 时间:2024/06/10 19:01
DWR框架在Ajax中的初级应用
   所谓DWR的定义借助百度百科解释为:DWR(Direct Web Remoting)是一个用于改善web页面与Java类交互的远程服务器端Ajax开源框架,可以帮助开发人员开发包含AJAX技术的网站。它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数,就像它就在浏览器里一样。
   之所以现在要学习了解一下DWR框架在Ajax中的应用,是因为自己最近在做一个小的项目,里面用到了DWR框架来将JAVA对象转换成JS对象,并且实现和浏览求交互,从而实现了异步通信。
   下面以一个简单的入门例子来聊聊自己对DWR框架应用的理解(以web项目为例子)
    1:首先,下载dwr.jar包(顺便附带下载一下commons-logging-1.1.jar,若是不用到此包的话,我们在运行项目的时候会报 org.apache.commons.logging.LogFactory异常错误,影响程序的执行),将其放置于application的WEB-INF/lib目录下。
    2:配置web.xml文件
     <!-- 配置DWR 核心Servlet -->
  <servlet>
  <servlet-name>dwr-invoker</servlet-name>
  <!-- 使用DWR框架自身的Servlet -->
  <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
  </servlet>
  <servlet-mapping>
  <servlet-name>dwr-invoker</servlet-name>
  <url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>
     3:配置dwr.xml文件,新建一个dwr.xml文件,和web.xml在同一目录下,也即WEB-INF/ 下面
     <?xml version="1.0" encoding="UTF-8"?>   
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
"http://www.getahead.ltd.uk/dwr/dwr10.dtd"> 
<dwr>
<allow>
<!-- 为java类配置DWR,从而让其可以在javascript和java对象之间转换 
creator=“new” 表示类的生成方式,"new"意味着DWR应该调用类的默认构造函数来获得类的实例
其他的还有spring方式,通过与IOC容器Spring进行集成来获得实例等等。
javascript指定js代码访问java对象时候的名称 
<include>标签指定要公开给JavaScript的方法,不指定的话公开所有的方法。
<exclude>标签指定要防止被访问的方法。
-->
<create javascript="MyDwr" creator="new">
<!--指定name=class表示其为类属性  value对应java中需要转换的类的全名 -->
<param name="class" value="com.dwr.test.DwrTest"></param>
</create>
</allow>
</dwr> 
      4:新建一个java类
package com.dwr.test;
public class DwrTest {
public DwrTest(){

}
public String getMyName(){
return "Clark Cao";
}
}
      5:index.jsp中引入javascript脚本
      <!-- 自己定义的一个dwr.xml文件中对应的js对象 -->
<script type="text/javascript" src="dwr/interface/MyDwr.js"></script>
<!-- DWR框架自带的两个js文件,在jar包下面可以找到 -->
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/util.js"></script>
      6:index,jsp编写调用java方法的JS函数。
      <script language="javascript">   
   var mycall=function callBack(data){  
       DWRUtil.setValue("demo1",data);  
   }  
   //直接通过java中的类名.method();
   function showMyName(){  
       MyDwr.getMyName(mycall);  
   }  
   function clearName(){  
       demo1.value="";  
   }  
</script> 
       7:index.jsp添加按钮
      <body>
    <h1>
    Ajax Test Page With DWR
    </h1>
    <input type="button" value="显示姓名" onclick="javascript:showMyName()"/>
    &nbsp;&nbsp;
    <input type="button" value="清空" onclick="javascript:clearName()"/><br/>
    <input type="text" id="demo1"/><br>
  </body>
  附带:DWR工作原理图解

原创粉丝点击