代码改变世界

DWR框架简单配置

2011-12-02 13:26  三皮开发时  阅读(354)  评论(0编辑  收藏  举报

1.Web.xml配置

 

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
    http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
    version="3.0">

    <!-- 定义Web应用的首页 -->
    <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
    
    
    <!-- 配置 DWR 核心Servlet -->
    <servlet>
        <!-- 指定 DWR 核心Servlet的名字 -->
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
        <!-- 指定 DWR 核心Servlet处于调试状态 -->
        <init-param>
            <!-- 设置debug为true,表名DWR应用处于debug模式下,DWR会为每一个远程调用类生成一个测试页面,用于检查DWR的工作状态 -->
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>        
        <param-name>crossDomainSessionSecurity</param-name>        
        <param-value>false</param-value>        
    </init-param>  
    </servlet>
    
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <!-- 指定核心Servlet映射URL -->
        <url-pattern>/leedwr/*</url-pattern>
    </servlet-mapping>
    
</web-app>
    
    
    
   

 

 

2.DWR配置 (dwr.xml 同web.xml文件同级目录)

 

<?xml version="1.0" encoding="GBK"?>
<!-- 指定DWR配置文件的DTD等信息 -->
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN"
    "http://www.getahead.ltd.uk/dwr/dwr20.dtd">
<!-- DWR配置文件的根元素是dwr -->
<dwr>
    <allow>
        <!-- 使用new关键资创建一个Java实例
            指定创建的JavaScript对象名为hello-->
        <create creator="new" javascript="hello">
            <!-- 使用class属性指定创建该Java实例的实现类 -->
            <param name="class" value="lee.HelloDwr"/>
        </create>
        <!-- 对lee.Person类使用Bean转换器 -->
        <convert converter="bean" match="lee.Person"/>
        <!-- 对lee.Cat使用Object转换器 -->
        <convert converter="object" match="lee.Cat">
            <!-- 指定force="true"强制使用反射访问私有属性 -->
            <param name="force" value="true"/>
        </convert>
    </allow>
    
    <!-- 列出所有方法的声明 -->
    <!-- 远程方法的参数是不带泛型的集合,因此需要提供 -->
    <signatures>
      <![CDATA[
        import java.util.List;
        import lee.HelloDwr;
        import lee.Person;
        HelloDwr.sendListNoGeneric(List<Person>);
     ]]>
    </signatures>
</dwr>

 

 

3. 导入的包有

commons-logging-1.0.4.jar 

dwr.jar --我用的是2.0,好像现在出3.0了

 

 

4.自己的测试JS

//-------------发送简单字符串参数,返回普通字符串--------------
function sendMessage()
{
    //获取页面中name元素的值
    var name = document.getElementById("name").value;
    //调用远程方法,cb是回调函数
    hello.hello(name , 
      {
        callback : cb,
        timeout:5000,
        errorHandle : function(message){
            alert("错误提示:"+message);
        },
        httpMethod : 'POST',
        async : true,
        //指定发送请求之前的钩子函数
        preHook : function(){
            alert('远程调用之前');
        },
        postHook : function(){
            alert('远程调用之后');
        }
    });
}
function cb(data)
{
    document.getElementById("show").innerHTML = data;
}
//-----------发送一个JavaBean对象作为参数,返回普通字符串------------
function sendObject()
{
    var nameValue = document.getElementById("name").value;
    //调用远程方法,使用JavaScript对象作为参数
    hello.sendObj({name:nameValue,sex:"male"} , cb);
}

//----------------调用返回JavaBean方法-----------------
function getBean()
{
    var name = document.getElementById("name").value;
    //调用远程方法,beanCb是回调函数
    hello.getBean(name , beanCb);
}
function beanCb(data)
{
    //服务器方法返回JavaBean对象,客户端的data是JavaScript对象
    document.getElementById("show").innerHTML = 
        data.name + ",您好,您已经学会了使用JavaBean返回值";
}
//----------------调用返回getObject方法---------------
function getObject()
{
    var name = document.getElementById("name").value;
    //调用远程方法,objCb是回调函数
    hello.getObject(name , objCb);
}
function objCb(data)
{
    //服务器方法返回非JavaBean式的对象,客户端的data是JavaScript对象
    document.getElementById("show").innerHTML = 
        data.name + ",是从服务器返回的猫的名字";
}
//---------------调用返回集合的方法--------------
function getBeanList()
{
    //调用远程方法,listCb返回回调函数
    hello.getPersonList(listCb);
}
//远程Java方法返回List对象,集合元素是JavaBean式的对象
//此处的data是JavaScript对象数组
function listCb(data)
{
    var result='';
    //遍历每个数组元素
    for (var i = 0 ; i < data.length ; i ++)
    {
        result += data[i].name + "<br />" + data[i].sex;
    }
    document.getElementById("show").innerHTML = result;
}
//---------------调用返回数组的方法--------------
function getBeanArray()
{
    hello.getPersonArray(arrayCb);
}
function arrayCb(data)
{
    var result = "";
    //下面的data是远程Java方法的返回值,
    
//data是个数组,遍历数组。
    for (var i = 0 ; i < data.length ; i ++)
    {
        //依次访问数组元素,数组元素是JSON格式的对象,访问其name属性
        result += data[i].name + "<br />";
    }
    document.getElementById("show").innerHTML = result;
}
//---------------调用返回Map对象的方法-------------
function getBeanMap()
{
    hello.getPersonMap(mapCb);
}
//远程Java方法返回Map对象,集合元素是JavaBean式的对象
//此处的data是JavaScript对象,且每个属性值都是JavaScript对象
function mapCb(data)
{
    var result='';
    for (var key in data)
    {
        result += "键为" + key + ",其值为:" + data[key].name + "<br />";
    }
    document.getElementById("show").innerHTML = result;
}

//---------------调用发送集合的方法-------------------
function sendBeanList()
{
    //创建JavaScript数组
    var args = [
        {
            sex:"Male",
            name:"客户端aaa"
            
        },
        {
            sex:"Female",
            name:"客户端bbb"
            
        },
        {
            sex:"NMNF",
            name:"客户端ccc"
        }
    ];
    //Java方法需要List参数,以JavaScript数组作为参数调用远程方法
    hello.sendList(args , sendListCb);
}
function sendListCb(data)
{
    document.getElementById("show").innerHTML = data;
}
//---------------调用发送无泛型限制的集合--------------------
function sendBeanListNoGeneric()
{
    //创建JavaScript数组
    var args = [
        {name:"客户端aaa"},
        {name:"客户端bbb"},
        {name:"客户端ccc"}
    ];
    //Java方法需要List参数,以JavaScript数组作为参数调用远程方法
    hello.sendListNoGeneric(args , sendListCb);
}
//---------------调用发送Map的方法-------------------------
function sendBeanMap()
{
    //创建JavaScript对象
    var args = {
    first:{name:"客户端aaa"},
    second:{name:"客户端bbb"},
    third:{name:"客户端ccc"}
    };
    //Java方法需要Map参数,以JavaScript对象作为参数调用远程方法
    hello.sendMap(args , sendMapCb);
}
function sendMapCb(data)
{
    document.getElementById("show").innerHTML = data;
}

function getList(){
    hello.getList(listCb);
}

function listCb(data){
    document.getElementById("show").innerHTML = data[0].name+"\n"+data[0].sex;
}

 

 

5.前台页面

 

<%@ page language="java" contentType="text/html; charset=GBK"
    pageEncoding="GBK"%>
<!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=GBK">
<title>DWR</title>
<!-- 导入DWR为hello对象动态生成的JavaScript代码库 -->
<script type='text/javascript' src='leedwr/interface/hello.js'>
</script>
<!-- 导入DWR引擎的核心JavaScript代码库 -->
<script type='text/javascript' src='leedwr/engine.js'></script>
<!-- 导入开发者为本应用编写的JavaScript代码库 -->
<script type='text/javascript' src='hellodwr.js'></script>

</head>
<script>
</script>
<form id="myForm" action="login">
    <body>
        <h3>DWR入门</h3>
    请输入您的名字<input id="name" name="name" type="text"/><br />
    <input type="button" value="发送简单请求" onclick="sendMessage();"/>
    <input type="button" value="发送对象参数" onclick="sendObject();"/>
    <input type="button" value="返回JavaBean" onclick="getBean();"/><br />
    <input type="button" value="返回Object" onclick="getObject();"/>
    <input type="button" value="返回Bean集合" onclick="getBeanList();"/>
    <input type="button" value="返回Bean数组" onclick="getBeanArray();"/><br />
    <input type="button" value="返回Bean Map" onclick="getBeanMap();"/>
    <input type="button" value="发送Bean集合" onclick="sendBeanList();"/>
    <input type="button" value="发送不带泛型限制的Bean集合"onclick="sendBeanListNoGeneric();"/>
    <input type="button" value="返回List集合" onclick="getList()"/>
    <br />
    <input type="button" value="发送Bean Map" onclick="sendBeanMap();"/>
    <hr />
    下面是服务器的回应:
    <br />
    <div id= "show"></div>
    </body>
</form>
</html>

 

 

6.后台类

 HelloDwr.java

package lee;
import java.util.List;
import java.util.ArrayList;
import java.util.Map;
import java.util.HashMap;

public class HelloDwr
{
    //第一个简单的hello方法
    public String hello(String name)
    {
        return name + ",您好!您已经开始了DWR的学习之旅,祝您学得开心...";
    }
    //使用一个JavaBean作为参数的方法
    public String sendObj(Person p )
    {
        return p.getName() + ",您好!您已经学会了使用JavaBean参数..." + p.getSex();
    }
    //返回JavaBean实例的方法
    public Person getBean (String name)
    {
        return new Person(name);
    }
    //返回一个普通的Java对象,Cat对象为其属性提供setter和getter方法
    public Cat getObject(String name)
    {
        return new Cat("服务器端" + name);
    }
    //返回一个集合对象
    public List<Person> getPersonList()
    {
        List<Person> result = new ArrayList<Person>();
        for (int i = 0; i < 3; i++){
            Person p = new Person();
            p.setName("姓名" + i );
            p.setSex("性别" + i);
            result.add(p);
        }
        return result;
    }
    //返回一个数组对象
    public Person[] getPersonArray()
    {
        Person[] result = new Person[3];
        result[0] = new Person("数组aaaa");
        result[1] = new Person("数组bbbb");
        result[2] = new Person("数组cccc");
        return result;
    }
    //返回一个Map对象
    public Map<String, Person> getPersonMap()
    {
        //创建一个Map对象
        Map<String, Person> result = new HashMap<String, Person>();
        //填充Map对象的内容
        result.put("first" , new Person("Map aaaa"));
        result.put("second" , new Person("Map bbb"));
        result.put("third" , new Person("Map cccc"));
        //返回Map
        return result;
    }
    //远程方法的参数是集合
    public String sendList(List<Person> pl)
    {
        String result = "";
        for (Person p : pl)
        {
            result += p.getName() + "," +p.getSex()+"<br />";
        }
        return result;
    }
//远程方法的参数是不带泛型的集合
public String sendListNoGeneric(List pl)
{
    String result = "";
    for (Object p : pl)
    {
        result += ((Person)p).getName() + "<br />";
    }
    return result;
}

    //远程方法的参数是集合
    public String sendMap(Map<String , Person> pmap)
    {
        String result = "";
        for (String key : pmap.keySet())
        {
            result += "" + key + " 其值为:" +
                pmap.get(key).getName() + "<br />";
        }
        
//        for(String key :pmap.keySet()){
//            Person p = (Person) pmap.get(key);
//            result += "键" + key + "其值为: " + p.getName() +"<br/>";
//        }
        
//        Person p = (Person) pmap.get("first");
//        result += "值为: " + p.getName() +"<br/>";
        
        return result;
    }
    
    //远程方法返回类型是List 
    public List getList(){
        List lstReturn = new ArrayList();
        Person p = new Person();
        p.setName("SanPi");
        p.setSex("Male");
        lstReturn.add(p);
        return lstReturn;
    }
}

 

 

Person.java

package lee;

public class Person
{
    //私有属性
    private String name;
    
    private String sex;
    
    public Person() {}
    //构造器
    public Person(String name)
    {
        this.name = name;
    }
    //name属性的setter方法
    public void setName(String name)
    {
        this.name = name;
    }
    //name属性的getter方法
    public String getName()
    {
        return name;
    }
    public String getSex() {
        return sex;
    }
    public void setSex(String sex) {
        this.sex = sex;
    }
}

 

 

 Cat.java

package lee;

public class Cat 
{
    //Cat类的私有属性
    private String name;
    //构造器
    public Cat(String name)
    {
        this.name = name;
    }
}


注:

解压dwr.jar,可以发现里面有engine.js,在它的里面有一个方法

DWREngine.setAsync = function(async) {
DWREngine._async = async;
};

所以在有些需求下,需要将异步转为同步模式,可以这样写 (以下是异步转同步代码片段)

 

//点击巡视功能位置显示设备列表信息
    function showDeviceLst(patrolFunctionId){
        DWREngine.setAsync(false);
        displayDeviceLst(patrolFunctionId);
        displayDevicePageRecord();
        DWREngine.setAsync(true);
    }