DWR 框架学习之<一>入门

DWR(Direct Web Remoting),能够为现有的基于JavaScript/JavaWEB应用轻松加入AJAX功能。
通过DWR,可以在JavaScript里简单地使用[Java类名.方法名]的形式直接调用Java里的方法。
DWR
主要特点:
1
,异步调用。除了支持从JavaScriptJava方法(浏览器到服务器)的异步调用之外,从DWR2.0开始,DWR开始支持从服务器到JavaScript的反转异步调用功能(ReversedAJAX)。
2
,与其他框架的依存度低,可简单与SpringStrutsWebWorkJSFHibernateBeehiveEJB3Seasar2等框架集成。
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  VersionDWR 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 目录,安装完成。

DWRsample
将下载的dwr.war文件拷贝到$TOMCAT_HOME/webapps目录下,启动Tomcat
※dwr.zip
的情况下,将dwr.zip重命名为dwr.war即可。

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

DWR框架的使用



1engine.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方法。

开发与测试环境:
IDEEclipse3.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

2DWR设置


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类:


创建好的JavaHelloDwr的内容如下:
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>


解说:
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()" οnclick="sayHello()
" />
<br>Replied:
<!--
显示HelloDwr.sayHello方法的返回值 -->
<div id="
helloDwrReply">
</div>

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


</body>
</html>


解说:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值