1、DWR简介
DWR是一个远程web调用框架，利用该框架使得Ajax开发变得简单。利用DWR可以在客户端使用JavaScript直接调用服务器端的Java方法，并返回值给JavaScript；就好像直接在本地客户端调用一样（DWR根据Java类来动态生成JavaScript代码）。
DWR包含两部分：
- 一个运行在服务器端的 Java Servlet，它处理请求并且向浏览器发回响应。
- 运行在浏览器端的 JavaScript，它发送请求而且还能动态更新网页。
2、DWR工作原理
通过动态把 Java 类生成为 Javascript。它的代码就像 Ajax 魔法一样，你感觉调用就像发生在浏览器端，但是实际上代码调用发生在服务器端，DWR 负责数据的传递和转换。这种从 Java 到JavaScript的远程调用功能的方式使DWR用起来有种非常像RMI或者SOAP的常规RPC机制，而且DWR的优点在于不需要任何的网页浏览器插件就能运行在网页上。
Java 从根本上讲是同步机制，然而 AJAX 却是异步的。所以你调用远程方法时，当数据已经从网络上返回的时候，你要提供有回调 （callback） 功能的 DWR。（通过回调函数来异步处理Java的函数调用过程）。
DWR 动态在 JavaScript 里生成一个 AjaxService 类，去匹配服务器端的代码。eventHandler 方法去调用服务器端代码，然后 DWR 处理所有的远程细节，包括转换（converting） 所有的参数以及返回 Javascript 和 Java 之的值。在示例中，先在 eventHandler 方法里调用 AjaxService 的 getOptions() 方法，然后通过回调方法 populateList(data) 得到返回的数据，其中 data 就是 String[]{"1", "2", "3"}，最后再使用 DWR utility 把data 加入到下拉列表。
3、DWR2.0示例代码——该示例中使用Maven创建WebApp项目
1）准备工作，创建一个Web项目，并创建domain层实体类——User，模拟DAO层——UserDao
User.java文件：
package com.techlogy.dwr.domain;
public class User {
private int id;
private String name;
private String password;
private String email;
public User() {
}
public User(String name, String password, String email) {
this.name = name;
this.password = password;
this.email = email;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
}
UserDao.java文件：
package com.techlogy.dwr.dao;
import java.util.HashMap;
import java.util.Map;
import com.techlogy.dwr.domain.User;
public class UserDao {
private static Map<Integer,User> db=new HashMap<Integer ,User>();
public boolean save(User usr){
User user=(User) db.get(usr.getId());
if(user!=null){
System.out.println("数据库中用户已经存在，无法保存！");
return false;
}
//数据库中不存在该用户时，保存
db.put(usr.getId(), usr);
System.out.println("用户保存成功！");
return true;
}
public User findById(Integer id){
User user=db.get(id);
return user;
}
}
2）模拟业务逻辑层——DWRUserService，其中创建两个方法saveUser方法和findUserById方法。该类供DWR框架远程调用。
package com.techlogy.dwr.service;
import com.techlogy.dwr.dao.UserDao;
import com.techlogy.dwr.domain.User;
public class DWRUserService {
private UserDao usrDao=new UserDao();
public boolean saveUser(User usr){
return usrDao.save(usr);
}
public User getUserById(Integer id){
return usrDao.findById(id);
}
}
3）web.xml配置文件：
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
<display-name>dwr</display-name>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<!-- 是否允许调试，设为true，才能允许调试DWR框架的远程方法。 -->
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<!-- 注意：将该项值设为true，回调函数（用于处理Java函数的返回值）才能在浏览器端起作用。
否则，回调函数不会起作用。 -->
<init-param>
<param-name>allowScriptTagRemoting</param-name>
<param-value>true</param-value>
</init-param>
<!-- 设为true，网页才能显示出来
<init-param>
<param-name>scriptCompressed</param-name>
<param-value>false</param-value>
</init-param> -->
<!-- 是否进行日志管理 -->
<init-param>
<param-name>logLevel</param-name>
<param-value>DEBUG</param-value>
</init-param>
<!--如果允许跨域请求，则将其设置为false。默认为true。 -->
<init-param>
<param-name>crossDomainSessionSecurity</param-name>
<param-value>false</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>
</web-app>
4）dwr.xml配置文件：
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC
"-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN"
"http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<!-- creator元素将DWRUserService类转换为DWRUserService.js代码 -->
<create creator="new" javascript="DWRUserService">
<param name="class" value="com.techlogy.dwr.service.DWRUserService"/>
</create>
<convert converter="bean" match="com.techlogy.dwr.domain.User"/>
</allow>
</dwr>
5）测试jsp页面——index.jsp，在该页面中一定要引入engine.js文件，util.js文件视使用而定。但得注意，需要引入DWR框架生成的DWRUserService.js代码文件，如下。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>DWR示例</title>
<script type="text/javascript" src="engine.js"></script>
<script type="text/javascript" src="util.js"></script>
<script type="text/javascript" src="useraccess.js"></script>
<script type="text/javascript" src="/dwrDemo/dwr/interface/DWRUserService.js"></script>
<script type="text/javascript">
window.onload=function(){
var saveBtn=document.getElementById("saveBtn");
saveBtn.onclick=OnSave;
var queryBtn=document.getElementById("queryBtn");
queryBtn.onclick=OnFind;
};
</script>
</head>
<body>
<h1>用户注册</h1>
<form name="regForm">
user ID:<input type="text" name="id"><br/>
username:<input type="text" name="name"><br/>
password:<input type="text" name="password"><br/>
email:<input type="text" name="email"><br/>
<input id="saveBtn" type="button" value="提交">
</form>
<hr/>
<h1>用户查询</h1>
<form name="queryForm">
登陆ID：<input type="text" name="id"><br>
<input id="queryBtn" type="button" value="查询"><br>
</form>
</body>
</html>
6）处理Java返回值得回调函数js代码——useraccess.js
function saveFun(data) {
if (data) {
alert("注册成功！");
} else {
alert("登陆ID已经存在！");
}
}
function OnSave() {
var userMap = {};
//var regForm=document.getElementsByName("regForm")[0];
userMap.id = regForm.id.value;
userMap.password = regForm.password.value;
userMap.name = regForm.name.value;
userMap.email = regForm.email.value;
DWRUserService.saveUser(userMap, saveFun);//saveFun为回调函数
console.log(userMap);
}
function findFun(data) {
if (data == null) {
alert("无法找到用户："+queryForm.id.value);
return;
}
alert("找到用户，nid："+data.id+"，npassword："+data.password+"，nname："+data.name+"，nemail："+data.email);
}
function OnFind() {
//var queryForm=document.getElementsByName("queryForm")[0];
console.log(queryForm.id.value);
DWRUserService.getUserById(queryForm.id.value, findFun);//findFun为回调函数
}
7）测试结果
- 用户注册结果：注册成功
- 再次注册相同ID用户，出现以下结果：
- 查找ID为3的用户，回调函数处理结果：
- 查找一个ID不存在的用户，处理结果如下：
以上是我个人的学习心得分享一下，皮毛之事。