DWR框架的使用

使用DWR框架的一般流程：

1搭建dwr开发环境：在项目中的WEB_INF-》lib添加dwr.jar包，再加入dwr.dar包的同时要加入commons-logging.jar（不然在启动服务器是会出错）

2.在web.xml文件加入DWR的servlet的配置，关键代码如下（这个servlet配置要放在过滤配置/*之前不然会被拦截）

  <!-- Ajax框架的配置，引入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>
        
    </servlet>
     
      <servlet-mapping>
          <servlet-name>dwr-invoker</servlet-name>
          <url-pattern>/dwr/*</url-pattern>
      </servlet-mapping>

3.在WEB-INF文件夹中创建一个dwr.xml文件，这个文件用于将后台的java代码登记到DWR框架中，代码如下

<?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>
     ....写配置
       
       </allow> 
   </dwr>

我在书上看到是这个,然后服务器一直启动失败，最后百度出来就因为这个版本的错误
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">

这个时候就开始写个jsp页面吧，做一个触发事件

<form action="" name="f1" method="post">
       用户名：<input type="text" name="username">
      <input type="button" value="确定" onclick="

sendHelloDwr

(f1.username.value);"> </form>

在写个普通java类，在方法中接收前台页面传过来的字符串进行处理（自己可以写一个逻辑处理）

package com.action;
public class HelloDwrAction {
	
	 public String helloDwr(String username) {
			
		  return username+"你好！";
	  }

}

4.现在配置dwr.xml文件，将后台java代码登记到dwr框架（在dwr.xml文件中的<allow>节点中加入后台代码的配置有关键的两个属性，1--<create>节点中的JavaScript属性，可以理解为将后台java类取得一个别名，然后再前台的JavaScript代码中，便可以通过这个别名访问到该类的方法。。<param>节点中的value属性就是这个java代码的类的位置）

        <allow>
         <create  creator="new" javascript="HelloDwr">
             <param  name="class" value="com.action.HelloDwrAction">               
             </param>
         </create>      
       </allow>

5.在页面导入DWR核心库及自定义接口函数库

最基本的就是engine.js,自定义接口库格式为/工程/dwr/interface/名称.js。这里的这个名称就是上一个步骤提到的java类的别名（在前台页面导入）

<script type="text/javascript" src="./dwr/engine.js"></script>
<script type="text/javascript" src="./dwr/interface/HelloDwr.js"></script>

这两个js文件并不需要我们编写，也不用拷贝到工程中，这两个文件是在运行的过程中由DWR框架自动生成的。

6.在JavaScript函数中编写DWR方式的代码提交部分数据到后台进行处理，我们需要定义前面onclick触发的函数

扫描二维码关注公众号，回复： 887491 查看本文章

<script language="javascript">
     function sendHelloDwr(name){
    	 //dwr方式的代码
    	 //两个参数：第一个是传的参数：第二个是回调函数
    	 HelloDwr.helloDwr(name,callBackHelloDwr);
     }
</script>

7.这时需要定义回调函数（放在上面函数的下面就行了）

 function callBackHelloDwr(data) {
	//通过data参数得到后台的处理结果
	alert(data);
}

这个回调函数有个参数data，这个参数就是后台的返回的结果，在方法体重得失得到的后台返回结果进行善后的JavaScript代码，这个例子直接将后台的返回结果通过警告框显示给用户，最终前台的JavaScript的完整代码是

<script type="text/javascript" src="./dwr/engine.js"></script>
<script type="text/javascript" src="./dwr/interface/HelloDwr.js"></script>
<script language="javascript">
     function sendHelloDwr(name){
    	 //dwr方式的代码
    	 //两个参数：第一个是传的参数：第二个是回调函数
    	 HelloDwr.helloDwr(name,callBackHelloDwr);
     }
 function callBackHelloDwr(data) {
	//通过data参数得到后台的处理结果
	alert(data);
}
</script>

这个用整个DWR框架完成的一个ajax应用实现过程就完成了

猜你喜欢