DWR中文文档v0.9 02

 

第1章. DWR入门


1.1 简介
DWR是一个可以允许你去创建AJAX WEB站点的JAVA开源库。它可以让你在浏览器中的Javascript代码调用Web服务器上的Java代码,就像在Java代码就在浏览器中一样。

 DWR包含2个主要部分:
1. 一个运行在服务器端的Java Servlet,它处理请求并且向浏览器发回响应。
2. 运行在浏览器端的JavaScript,它发送请求而且还能动态更新网页。
DWR工作原理是通过动态把Java类生成为Javascript。它的代码就像Ajax魔法一样,你感觉调用就像发生在浏览器端,但是实际上代码调用发生在服务器端,DWR负责数据的传递和转换。这种从Java到JavaScript的远程调用功能的方式使DWR用起来有种非常像RMI或者SOAP的常规RPC机制,而且DWR的优点在于不需要任何的网页浏览器插件就能运行在网页上。

 Java从根本上讲是同步机制,然而AJAX却是异步的。所以你调用远程方法时,当数据已经从网络上返回的时候,你要提供有反调 (callback) 功能的DWR。

这个图片显示了DWR如何选择一个下拉列表的内容作为JavaScript 的onclick事件的结果。 DWR动态在JavaScript里生成一个AjaxService类,去匹配服务气端的代码。由eventHandler去调用它,然后DWR处理所有的远程细节,包括倒置 (converting) 所有的参数以及返回Javascript和Java之的值。在示例中,先在eventHandler方法里调用AjaxService的getOptions() 方法,然后通过反调 (callback) 方法populateList(data) 得到返回的数据,其中data就是String[]{"1", "2", "3"},最后再使用DWR utility 把data加入到下拉列表。

好了,DWR介绍完了,现在大家肯定很想知道如何做出第一个DWR吧!然后我们在下一章节以一个HelloWorld示例带领大家入门。

 

1.2 第一个DWR程序:Hello World
有2中方法可以帮助你入门DWR,一个方法是去下载WAR文件并且去完整看一下代码,但是这样并不能帮助你发现DWR是如何简单地集成到你当前地WEB应用,所以以下几个简单地步骤推荐看一下:
1.2.1 将DWR放入你的工程
1) 从官方网站下载dwr.jar包。然后将它放在你webapp的WEB-INF/lib目录下。
2) 将下载的dwr-版本号-src.zip /java/org/directwebremoting内的engine.js和util.js放入WEB应用中,比如js文件夹下。
1.2.2 编辑配置文件
1. web.xml
以下几行代码必须被添加到WEN-INF/web.xml文件中。注意,要把<servlet>和其他<servlet>放在一起,<servlet-mapping>要和其他<servlet-mapping>放在一起

 

Java代码 复制代码
  1. <servlet>   
  2.  <servlet-name>dwr-invoker</servlet-name>    
  3. <servlet-class> org.directwebremoting.servlet.DwrServlet </servlet-class>   
  4.  <init-param>   
  5.  <param-name>debug</param-name>   
  6.  <param-value>true</param-value>   
  7.  </init-param>   
  8.  </servlet>   
  9.  <servlet-mapping>    
  10. <servlet-name>dwr-invoker</servlet-name>   
  11.  <url-pattern>/dwr/*</url-pattern>    
  12. </servlet-mapping>   
  13.    


2. dwr.xml
在web.xml的同一目录下,创建dwr.xml,并且将要被调用的java类写入其中。

Java代码 复制代码
  1. <?xml version="1.0" encoding="UTF-8"?>   
  2.  <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd">   
  3.  <dwr>    
  4. <allow>    
  5. <create creator="new" javascript="service">   
  6.  <param name="class" value="helloWorld.Service" />   
  7.  </create>    
  8. </allow>   
  9.  </dwr>  

 1.2.3 编写service
就像没有dwr一样,写一个简单类并加一个方法 是 

Java代码 复制代码
  1. package helloWorld;   
  2.  public class Service {    
  3.      public String sayHello(String yourName) {   
  4.      //可以是访问数据库的复杂代码    
  5.     return "Hello World " + yourName;   
  6.     }   
  7.  }  

 1.2.4 测试DWR
将代码放入应用服务器(比如Tomcat),启动。
然后在地址栏输入http://localhost:8080/你的工程/dwr

然后点击service,会看到刚才写的sayHello()的方法,输入自己的名字然后点击“Execute”,如果发现确实是正确的返回结果,说明测试通过了,可以进入下一步了。

1.2.5 编写一个jsp
接下来最后一步就是创建一个jsp文件 1) 要引用几个dwr的js,其中engine.js必须要,如果需要用到dwr提供的一些方便的工具要引用util.js 2) 然后还要引用dwr自动生成的js,dwr/interface/service.js,注意js名字要和dwr.xml配置的一样 3) js里的service.sayHello和java类的那个有一点区别,多了个参数,用来callback返回的数据

Java代码 复制代码
  1. <%@ page language="java" pageEncoding="UTF-8"%>    
  2. <html>    
  3. <head>    
  4. <title>My JSP 'first_dwr.jsp' starting page</title>   
  5.  <script type='text/javascript' src='js/util.js'></script>    
  6. <script type='text/javascript' src='js/engine.js'></script>    
  7. <script type='text/javascript' src='dwr/interface/service.js'> </script>    
  8. <script type="text/javascript">    
  9. function firstDwr(){   
  10.    service.sayHello("Jorwen",callBackHello);    
  11. }   
  12.       
  13. function callBackHello(data){    
  14.    alert(data);    
  15. }    
  16. </script>    
  17. </head>   
  18. <body>    
  19. <input type="button" name="button" value="测试" οnclick="firstDwr()">    
  20. </body>    
  21. </html>  

 

地址栏输入http://localhost:8080/你的工程/first_dwr.jsp 显示的结果如下:

1.3 本章总结
相信看了此章节,大家一般都能做出这个实例来,也算是DWR刚入门了,在以后的教程里将详细介绍DWR各个功能。帮助大家能开发出任何Ajax需求的功能来。更多进阶的例子可以参考范例精讲,您也可以通过看范例学习DWR然后有疑问再查看该文档的相关章节。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值