DWR的学习文档（Hello World,类型转换)

tianting_wx

浏览: 42700 次
性别:
来自: 深圳

最近访客更多访客>>

kuner_rick

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

DWR JavaScript Acegi Servlet Bean

DWR是作为远程调用的ajax框架，将服务端的java类，方法和浏览器的javascript的类，方法对应起来。现在官方最新的版本是DWR2.0，可以在http://getahead.ltd.uk/dwr/download下载到。
我们真对DWR2.0做一些例子讲解一下它的特性：
Hello World：
新建一个web项目DWRStudy，在项目中构建路径中加入dwr.jar，
新建类Hello如下：

package org.li.dwr;   
  
import java.util.Date;   
  
public class Hello   
{   
    public String getHelloWorld()   
    {   
        return "现在的时间为："+new Date();   
    }   
}

在WEB-INF目录下新建dwr.xml文件：

<?xml version="1.0" encoding="UTF-8"?>   
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd">   
<dwr>   
    <allow>   
    <!-- javascript的对象是jshello,create="new"是DWR自己创建类 -->   
        <create javascript="jshello" creator="new" scope="application">   
            <param name="class" value="org.li.dwr.Hello"></param>   
        </create>   
    </allow>   
</dwr>

在WebRoot目录里新建hello.js

function load()//载入的时候调用   
{   
    var jbutton = document.getElementById("jbutton");   
    jbutton.onclick=function(event)//注册按钮点击事件   
    {   
        jbClick();   
    };   
}   
function jbClick()//按钮点击事件   
{   
    jshello.getHelloWorld(callback);//没有参数传递，只传递回调函数就行   
}   
function callback(msg)//回调函数   
{   
    DWRUtil.setValue('jdiv',msg);   
}

在WebRoot目录里新建HelloWorld.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   
<html>   
  <head>   
    <title>HelloWorld.html</title>   
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">   
    <script type='text/javascript' src='dwr/interface/jshello.js'></script>   
    <script type='text/javascript' src='dwr/engine.js'></script>   
    <script type='text/javascript' src='dwr/util.js'></script>   
    <script type="text/javascript" src="hello.js"></script>   
  
  </head>   
     
  <body>   
    <input id="jbutton" type="button" value="得到Hello World"/>   
    <div id="jdiv"></div>   
    <script>load()</script>   
  </body>   
</html>

在web.xml中加入一个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>   
        <load-on-startup>1</load-on-startup>   
    </servlet>   
  
    <servlet-mapping>   
        <servlet-name>dwr-invoker</servlet-name>   
        <url-pattern>/dwr/*</url-pattern>   
    </servlet-mapping>

运行一下服务器，在浏览器里输入http://localhost:8080/DWRStudy/HelloWorld.html，然后点一钮，下面就会显示服务端的系统时间了，而浏览器页面并没有被刷新。

下面解释一下：

1. 新建的Hello类中有一个getHelloWorld方法，这个方法就是作为远程调用的服务端方法，这个Hello类也就是远程调用的类，方法的返回值为服务端当前的时间。

      2. dwr.xml是DWR用来配置服务端类和浏览器端javascript类之间的映射。可以下载dtd看一下，在<allow></allow>里配置映射类如：<create javascript="jshello" creator="new" scope="application">
                                                            <param name="class" value="org.li.dwr.Hello"></param>
                                                   </create>
javascript="jshello"是在浏览器端的javascript的映射的类名（不要用javascript里的关键字），creator="new"是表示这个类是dwr自己创建的。如果creator="new"，那么就必须有下面的<param name=“class” value=“类的全路径”></param>。creator还可为spring(与spring集成的时候)、script(与apache的一个框架BSF集成的时候用)，后来又加入了struts、jsf、ejb3。最后的scope=”application”是说这个pojo类的范围，和jsp是一样的。

3. 创建hello.js和HelloWorld.html，都是看自己是怎么发挥了。注意的是在HelloWorld.html中导入js文件的时候注意顺序和路径命名规律，自己发挥的这个hello.js一定放在后面，因为要调用其它js文件中的函数。由于在HelloWorld.html里写入了<script>load()</script>，所以在html加载的时候会调用hello.js里的load方法(注意这几个js文件里的函数最好不要重名)，在load里面做的事情就是注册一下id为jbutton的按钮的点击事件。当我们点击id为jbutton的按钮时，就开始用与服务器端的类相对应的javascript类了（jshello），直接调用jshello类的getHelloWorld方法，可以向函数传递参数，不过要在最后加一个回调函数。而我们的服务端的类没有参数就直接传回调函数了。在回调函数的形参msg是服务端Hello类中getHelloWorld方法返回值。在回调函数里面调用了DWR的工具类DWRUtil类的setValue方法设置id为jdiv的值。另外我们把doucment.getElementById(“jbutton”);换与$(“jbutton”)也可以得到同样的效果，这就有点像prototype了。

4. 在web.xml里加入DWRServlet的配置：一是为了远程调用，二是自动生成了<script type='text/javascript' src='dwr/interface/jshello.js'></script>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>文件。

上面HelloWorld例子只是返回了一个字符串，当然我们显示字符串很容易，可是如果返回一个对象怎么办呢？DWR为我们将java类和javascript的DOM对象，不过这得需要我们在dwr.xml里配置。

再看一个综合的例子：

新建类User

package org.li.dwr;   
  
import java.io.FileInputStream;   
import java.io.FileNotFoundException;   
import java.io.IOException;   
import java.util.ArrayList;   
import java.util.List;   
import java.util.Properties;   
  
public class User   
{   
    private String welcome;   
    private String username;   
    private String address;   
    private List<Book> books;   
    private int age;   
    public String getAddress()   
    {   
        return address;   
    }   
    public void setAddress(String address)   
    {   
        this.address = address;   
    }   
    public int getAge()   
    {   
        return age;   
    }   
    public void setAge(int age)   
    {   
        this.age = age;   
    }   
    public String getUsername()   
    {   
        return username;   
    }   
    public void setUsername(String username)   
    {   
        this.username = username;   
    }   
    public String getWelcome()   
    {   
        return welcome;   
    }   
    public void setWelcome(String welcome)   
    {   
        this.welcome = welcome;   
    }   
    public List<Book> getBooks()   
    {   
        return books;   
    }   
    public void setBooks(List<Book> books)   
    {   
        this.books = books;   
    }   
    public List<Book> getBook()   
    {   
        this.books = new ArrayList<Book>();   
        Book javaBook = new Book();   
        Book vcBook = new Book();   
        javaBook.setAuthor("孙鑫");   
        vcBook.setAuthor("孙鑫");   
        javaBook.setName("java Web开发详解");   
        vcBook.setName("vc++深入详解");   
        this.books.add(javaBook);   
        this.books.add(vcBook);   
        return this.books;   
    }   
    public User getUser(String welcome)   
    {   
        this.welcome=welcome;   
        try  
        {   
            FileInputStream fis = new FileInputStream("D:\\workspace\\DWRStudy\\src\\user.properties");   
            Properties pp = new Properties();   
            pp.load(fis);   
            this.username=pp.getProperty("username");   
            this.age=Integer.valueOf(pp.getProperty("age"));   
            this.address=pp.getProperty("address");   
            fis.close();   
        }   
        catch (FileNotFoundException e)   
        {   
            // TODO Auto-generated catch block   
            e.printStackTrace();   
        }   
        catch (IOException e)   
        {   
            // TODO Auto-generated catch block   
            e.printStackTrace();   
        }   
        return this;   
    }   
}

新建Book类：

package org.li.dwr;   
  
public class Book   
{   
    private String name;   
    private String author;   
    public String getAuthor()   
    {   
        return author;   
    }   
    public void setAuthor(String author)   
    {   
        this.author = author;   
    }   
    public String getName()   
    {   
        return name;   
    }   
    public void setName(String name)   
    {   
        this.name = name;   
    }   
}

新建DWRLog类

package org.li.dwr.log;   
  
import java.lang.reflect.Method;   
  
import org.directwebremoting.AjaxFilterChain;   
  
public class DWRLog implements org.directwebremoting.AjaxFilter   
{   
  
    public Object doFilter(Object obj, Method method, Object[] params, AjaxFilterChain chain) throws Exception   
    {   
        System.out.println("过滤器Log输出:..对象："+obj.getClass().getName()+"方法："+method.getName());   
        return chain.doFilter(obj, method,params);   
    }   
       
}

新建D:\\workspace\\DWRStudy\\src\\user.properties
username=javafish
age=21
address=北京市海淀区
然后在dwr.xml里加入

<create javascript="jsuser" creator="new">   
            <param name="class" value="org.li.dwr.User"></param>   
            <!-- 过滤允许调用的方法 -->   
            <include method="getUser"/>   
            <include method="getBook"/>   
            <!-- 配置自己的过滤器 -->   
            <filter class="org.li.dwr.log.DWRLog"></filter>   
        </create>   
        <!-- 需要转换的类 -->   
        <convert match="org.li.dwr.User" converter="bean"></convert>   
        <convert match="org.li.dwr.Book" converter="bean"></convert>

新建UserInfo.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   
<html>   
  <head>   
    <title>UserInfo.html</title>   
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">   
    <script type='text/javascript' src='dwr/interface/jsuser.js'></script>   
    <script type='text/javascript' src='dwr/engine.js'></script>   
    <script type='text/javascript' src='dwr/util.js'></script>   
    <script type="text/javascript" src="userInfo.js"></script>   
  
  </head>   
     
  <body>   
    请输入你的名字：   
    <input id="name" type="text"/>   
    <input id="jbutton" type="button" value="得到javafish的信息"/>   
    <input id="sbutton" type="button" value="得到javafish的书"/>   
    <div id="result"></div>   
    <script>load()</script>   
  </body>   
</html>

新建userInfo.js

function load()   
{   
    var jbutton = $("jbutton");   
    jbutton.onclick=function(event)   
    {   
        bOnClick();   
    };   
    var sbutton = $("sbutton");   
    sbutton.onclick=function(event)   
    {   
        sOnClick();   
    };   
}   
function bOnClick()   
{   
    jsuser.getUser($("name").value,callback);   
}   
function callback(msg)   
{   
    var user = msg;   
    DWRUtil.setValue('result',"欢迎你！"+user.welcome+"   姓名："+user.username+",年龄："+user.age+"，住址："+user.address+user.books[0].author);   
}   
  
  
function sOnClick()   
{   
    jsuser.getBook(callbackBooks);   
}   
function callbackBooks(msg)   
{   
    alert(msg);   
    DWRUtil.setValue('result',msg);   
}

运行服务器输入http://localhost:8080/DWRStudy/UserInfo.html，可看到运行结果
这个例子需要解释的就是dwr.xml了
在这里用到了两个java类，User、Book，方法呢就是User.getUser和User.getBook，而Book类呢由于我们没有在javascript中调用，所以就不用配置Book的create了。
大家可能会奇怪为什么会多出来两个<convert match="org.li.dwr.User" converter="bean"></convert>
<convert match="org.li.dwr.Book" converter="bean"></convert>
呢，是因为在调用getBook和getUser的时候会返回给javascript有关User和Book的对象或数据，这里的用<convert match=”类” converter=”bean”/>做一下转换，否则javascript将不会得到有效的数据。
下面讨论一下DWR的安全性，由于我们将javaBean整体都对外暴露了，所以说会有非常多的安全问题，真对这些DWR也作了一些的措施就是上面例子中dwr.xml的配置：
<include method="getUser"/>
<include method="getBook"/>
<filter class="org.li.dwr.log.DWRLog"></filter>
这样配置的话就只暴露了User类的两个方法getUser,getBook。就相对安全多了，相反还有<exclude>的配置它们是类似的。对于安全我们也可以用DWR的过滤器来实现，这里我用过滤器实现的是一个日志记录。过滤器类只需要实现AjaxFilter接口就可以了，不过注意的是这个过滤器不是HttpServelt的过滤器而是DWR自己内部实现的（有兴趣可以查看一下源代码）。
真对DWR的安全性上来说，官方也不敢保证，官方只是说自己可以看一下源代码因地施宜。
不过DWR可以和acegi集成，让acegi来管理安全问题。由于acegi我还没有完全搞定关于DWR和acegi的集成，先放一放日后补充。
下面对DWR.xml的配置具体补充一下：
首先是<init></init>里面有<converter>和<create>是配置在初始化的时候需要创建和转化的类。
然后是<allow></allow>里面有<converter>和<create>这个地方就是正式的配置了，creator里有param,filter,include,exclude,auth，除了auth我们都接触过了，而auth是集成J2EE的安全认证用的，这个可能和acegi的集成有关吧（？）。<converter>呢，它的converter有很多
? Array Converter
? Bean and Object Converters
? Collection Converter
? Enum Converter
? DOM Objects
这些都是转换的时候配置的
还有就是<signatures></signatures>的配置了，申明一些不java用反射不可得到的参数类型。
我在上面例子上用的getBook来本来想用signatures实现List<Book>的转换可是没有成功（不用配置就可以）
主要是真对jdk1.4以下的，我本机用的是jdk6,所以屡试不爽最后在官方DWR2的特性中看到如果你用的是DWR2和JDK5以上的话就不用配置了DWR会自动转换。

分享到：

DWR学习 | Eclipse和MyEclipse工程描述符详解

2008-11-04 14:42
浏览 1269
评论(0)
查看更多

发表评论

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

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论