DWR3 学习笔记 - 对象传输

在上一篇中DWR3 学习笔记 - 第一个DWR3程序(扩展），介绍了第一个DWR的例子扩展，这篇介绍一下DWR中是如何传输对象的。
在DWR3的架构中，对象传输（将一个对象序列化成可以在网络上传输的字节流）是一个必不可少的过程，看看下面DWR3的对象传输有多简单。

为了简单，我只添加了两个成员属性，name和age

package com.test.bean;

public class User {
	@Override
	public String toString() {
		return "User [name=" + name + ", age=" + age + "]";
	}
	private String name;
	private int age;
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	
}

第二步，修改dwr.xml,因为dwr不会自动传输对象，因此我们需要在xml中进行声明:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC
    "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN"
    "http://directwebremoting.org/schema/dwr30.dtd">
<dwr>
  <allow>
    <create creator="new" javascript="dwrtest">
    	<param name="class" value="com.test.service.Dwrtest"></param>
    </create>
    <convert match="com.test.bean.User" converter="bean" />
   </allow>
</dwr>

第三步,增加一个Service类来测试对象上传和下载，为了简单，只是将对象名字修改了一下，然后原封不动传回给客户端

package com.test.service;

import com.test.bean.User;

public class Dwrtest {
	public User send(User user)
	{
		System.out.println(user.toString());
		user.setName(user.getName() + "(from Server)"); //做个标记，标明这个对象从Server上下载
		return user;
	}
}

第四步，写Client端的Jsp测试页面 test1.jsp：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<base href="<%=basePath%>">
	<title>Insert title here</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<script type='text/javascript' src='/dwr3test/dwr/engine.js'></script>
	<script type='text/javascript' src='/dwr3test/dwr/util.js'></script>
  	<script type='text/javascript' src='/dwr3test/dwr/interface/dwrtest.js'></script>
  	<script type="text/javascript">
  		function sendUser()
  		{
 			dwrtest.send(
  					{	name:dwr.util.getValue("username"),
  						age: dwr.util.getValue("age")
  					},
  					function(data)
  					{
  						dwr.util.setValue("receiveUser","username:" + data.name + " age:" + data.age);
  					}
  			);
  		}
  		function User(name, age)
  		{
  			this.name=name;
  			this.age = age;
  		}
  	</script>
</head>
<body>
	<p>对象传输测试：</p>
	<p>用户名：<input type="text" id="username" size="20" value=""/></p> 
	<p>年龄: <input type="text" id="age" size="20" value="" /></p>
	<p> <input type="button" value="对象测试" onclick ="sendUser()"> </p>
	<p>接收对象</p>
	<div id="receiveUser" />
</body>
</html>

注意事项：

eclipse和tomcat7配合好像总会偶尔有问题出现，刚开始的时候连DwrServlet都无法加载，查了老半天没发觉web.xml有什么问题，最后直接将另外一个可以使用的web.xml复制过来，奇迹般的可以了。
Javascript的对象处理有多种方法，你可以先定义一个对象（在js中可以用function定义），然后赋值，也可以直接用{property:value, property:value}直接传送对象，我这里用的是第二种。
千万要小心dwr.util.addOptions这个方法，我之前视图用这个方法来保存返回的User对象，结果老是报:dwrutil.addOptions can only create select lists from objects....查了老半天，才发觉Server的返回类型必须是Array of Object....我的返回类型直接是User，结果就悲剧了。这里为了简单，直接用setValue来保存单个值
源代码我打包上传了，下载地址：点击打开链接

DWR3 学习笔记 - 对象传输

猜你喜欢