`
高级java工程师
  • 浏览: 409026 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

第一章

    博客分类：
  • ajax
DWRJavaJavaScriptWebAjax 
阅读更多 
关键字: ajax 框架dwr helloworld示例 

DWR（Direct Web Remoting），能够为现有的基于JavaScript/Java的WEB应用轻松加入AJAX功能。

通过DWR，可以在JavaScript里简单地使用[Java类名.方法名]的形式直接调用Java里的方法。

DWR主要特点：

1，异步调用。除了支持从JavaScript到Java方法（浏览器到服务器）的异步调用之外，从DWR2.0开始，DWR开始支持从服务器到JavaScript的反转异步调用功能（ReversedAJAX）。

2，与其他框架的依存度低，可简单与Spring，Struts，WebWork，JSF，Hibernate，Beehive，EJB3，Seasar2等框架集成。

3，可测试性好

4，多浏览器支持

5，支持免dwr.xml配置annotation功能。

6，成熟健壮，有丰富的帮助文档资料。





License：Apache Software License v2.



DWR官方首页：

http://getahead.org/dwr/



 



DWR(Direct Web Remoting)是一个WEB Ajax轻量级框架。本文，介绍DWR2.0.3的安装与使用。



DWR是什么







DWR(Direct Web Remoting)是一个WEB Ajax轻量级框架。它可以为WEB应用轻松加入Ajax功能，使用DWR，可以简单地从JavaScript调用Java中定义的方法。



DWR - 轻量级AJAX框架：Easy Ajax for Java 





本文，介绍DWR2.0.3的安装与使用。

-除了部分差异之外，DWR1.x的安装与使用同DWR2基本一样。



测试环境：

DWR  Version：DWR Version 2.0.3

Web服务器：Tomcat 5.5

OS：Windows XP





开始本文之前，请确认您已经安装好了至少一款WEB服务器。

有关WEB服务器的安装，可以参考：

Linux 环境下 Web服务器Tomcat的安装与使用入门 

Windows 环境下 Web服务器Tomcat的安装与使用入门 



DWR 2 的安装





首先，从DWR的官方网站 下载DWR的最新稳定版（这里，以dwr-2.0.3为例加以说明）。

  

dwr.jar

              实际上的开发需要使用到的文件

dwr.war

              dwr sample项目

dwr-2.0.3-src.zip

              dwr 2.0.3源代码



实际上的开发需要使用到的文件只有dwr.jar一个文件。



如果你对DWR还不太熟悉，建议你一起下载dwr.war文件，通过dwr.war，你可以学习dwr的基本用法等。



将下载的dwr.jar文件拷贝到目标WEB项目中的 WEB-INF/lib 目录，安装完成。



DWR的sample

将下载的dwr.war文件拷贝到$TOMCAT_HOME/webapps目录下，启动Tomcat。

※dwr.zip的情况下，将dwr.zip重命名为dwr.war即可。



打开浏览器，访问http://localhost:8080/dwr/，显示以下页面：





DWR框架的使用







1，engine.js 以及util.js文件是DWR框架提供的 Javascript 文件，它们被包含在dwr.jar文件之中。



2，使用DWR，需要在web.xml定义DwrServlet，如下：

代码
        <servlet>
                            <servlet-name>dwr-invoker</servlet-name>
                            <display-name>DWR Servlet</display-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>







      DWR1.x的情况下，为：

<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>





3，要在Javascript中调用Java类的方法，需要在dwr.xml中作类似以下设置：



代码
<dwr>
  <allow>
    <create creator="new" javascript="与Java类相对应的Javascript名">
      <param name="class" value="Java类名"/>
    </create>
  </allow>
</dwr>





一般来说，定义 [与Java类相对应的Javascript名] = [Java类名] 就OK了。



4，JSP/HTML文件中作以下定义：



代码
<script type='text/javascript' src='dwr/engine.js'> </script>
<script type='text/javascript' src='dwr/util.js'> </script>
<script type='text/javascript' src='dwr/interface/dwr.xml定义好的Javascript名.js'> </script>




本文将使用DWR2，开发一个简单地WEB应用程序：Hello World DWR。



Hello World DWR将从HelloDwr.html 文件调用Java方法。



开发与测试环境：

IDE：Eclipse3.3

WEB服务器：Tomcat5.5

OS：WindowsXP

DWR版本：DWR 2.0.3



步骤



1，利用Eclipse创建一个新项目“HelloDWR”。





创建好的项目具有以下阶层：

HelloDWR
    \src
    \build
    \WebContent
        \ META-INF
            MANIFEST.MF
        \ WEB-INF
        \ classes
        \ lib
        web.xml





2，DWR设置





1）将下载的dwr.jar文件拷贝到HelloDWR/WebContent/WEB-INF/lib目录下。

2）打开web.xml文件，定义DWR servlet，内容如下：

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4"
    xmlns="http://java.sun.com/xml/ns/j2ee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
    <display-name>HelloDWR</display-name>

    <servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <display-name>DWR Servlet</display-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>
</web-app>






 



3，创建一个简单的Java类：





创建好的Java类HelloDwr的内容如下：

HelloDwr.java

package com.syboos.test.dwr;

public class HelloDwr {
    //无参数方法定义
    public String sayHello() {
        return "Hello DWR!";
    }
    
    //有参数方法定义
    public String sayHelloWithParam(String name) {
        return "Hello:" + name;
    }
}

 





4，在HelloDWR/WebContent/WEB-INF目录下创建dwr.xml文件





dwr.xml内容为：



]<!DOCTYPE dwr PUBLIC
    "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN"
    "http://getahead.org/dwr/dwr20.dtd">

<dwr>
  <allow>
    <create creator="new" javascript="HelloDwr">
      <param name="class" value="com.syboos.test.dwr.HelloDwr"/>
    </create>
  </allow>
</dwr>

[/code
解说：
1），    <create creator="new" javascript="HelloDwr">
为javascript属性设置Java类的Javascript类名。一般情况，设置与Java类的名称同名。
2），     <param name="class" value="com.syboos.test.dwr.HelloDwr"/>
为value属性设置Java类的全名（包名.类名）
只作以上简单的设置，便可以从HTML文件中调用HelloDwr类的方法。

 

5，创建调用Java类的HTML文件。


创建好的HelloDwr.html文件内容如下：


<!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=windows-31j">
<title>Insert title here</title>

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

<script language="javascript">
//调用无参数Java方法
function sayHello() {
  HelloDwr.sayHello(function(data) {
    dwr.util.setValue("helloDwrReply", data);
  });
}

//调用有参数的Java方法
function sayHelloWithParam() {
  var name = dwr.util.getValue("name");    //参数
  HelloDwr.sayHelloWithParam(name, function(data) {
    dwr.util.setValue("helloDwrReply2", data);
  });
}

  </script>
</head>
<body>

<input type="button" value="HelloDwr.sayHello()" onclick="sayHello()" />
<br>Replied:
<!-- 显示HelloDwr.sayHello方法的返回值 -->
<div id="helloDwrReply">
</div>

<hr>
<input id="name" type="text">
<input type="button" value="HelloDwr.sayHelloWithParam()" onclick="sayHelloWithParam(name)" />
<br>Replied:
<!-- 显示HelloDwr.sayHelloWithParam方法的返回值 -->
<div id="helloDwrReply2">
</div>


</body>
</html>






  


  

    
    
分享到：
      
      
    

  


  

    

      
      |
      java各种排序
    

  

  

        
  

    
  

    
评论

    
    
    
    
  


  

    
发表评论

            
   您还没有登录,请您登录后再发表评论 

      

  

  





  

    
相关推荐

    
    
  





  
    Magicbox
  













      

      
        

          

            

              

                

                
              

            

            


            

          

        

            
    

    
    
  

  



   Global site tag (gtag.js) - Google Analytics