dwr的入门示例
通过DWR框架，java开发者能够很方便的使用Ajax技术，使得java开发者在不熟悉使用Ajax进行异步数据交换的情况下能够顺利达到客户端跟服务端进行异步数据交换。
下面的例子是一个入门上手的简单例子。例子的项目名为 test，使用myeclipse8.5，数据库为mysql5.0，dwr为2.0开发。项目所需的包名:mysql-connector-java-5.0.8-bin.jar连接mysql数据库用的驱动包)，dwr.jar（dwr框架包），commons-logging-1.0.4.jar（dwr框架所需的日志包），使用dwr框架，其中dwr.ar，commons-logging-1.0.4.jar两个包缺一不可。文章首先把项目的代码全部贴出，代码的具体用处和说明在文章第二节会说明。
第一节
第一步：新建一个名为test的web项目工程。
第二步：编写连接数据库的Conn类。示例项目中所有的java类都是放在com.joyun.test包中。
package com.joyun.test;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
public class Conn {
public Connection connDB() throws Exception{
//1、注册驱动
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/joyunblog";
//2、加载驱动
Connection conn=DriverManager.getConnection(url, "root", "admin");
return conn;
}
}
第三步：编写一个User类。
package com.joyun.test;
public class User {
private String name = null;
private String password = null;
public String getName() {
return name;
}
public String getPassword() {
return password;
}
public void setName(String name) {
this.name = name;
}
public void setPassword(String password) {
this.password = password;
}
}
第四步：编写UserDao类。
package com.joyun.test;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.SQLException;
public class UserDao {
public boolean save(User user){
boolean b = false;
String name = user.getName();
String password = user.getPassword();
Connection conn = null;
try {
try {
conn = new Conn().connDB();
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
String sql = "insert into myself(myname,mypassword,createtime,updatetime)" +
"values(+"+name+","+password+",now(),now())";
PreparedStatement ps = conn.prepareStatement(sql);
int i = ps.executeUpdate();
if(i==1){
b = true;
}
}catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return b;
}
}
第五步：编写UserJs类。
package com.joyun.test;
public class UserJs {
UserDao userDao = new UserDao();
public boolean save(User user){
return userDao.save(user);
}
}
第六步：编写jsp页面。该页面为index.jsp页面，代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="gbk"%>
<%@ page contentType="text/html; charset=gb2312" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
request.setCharacterEncoding("gb2312");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<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">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script src="<%=basePath%>dwr/engine.js"></script>
<script src="<%=basePath%>dwr/util.js"></script>
<script src="<%=basePath%>dwr/interface/UserJs.js"></script>
<script type="text/javascript">
function OnSave(){
var user = {};
user.name = regForm.name.value;
user.password = regForm.password.value;
UserJs.save(user, saveFun);
}
function saveFun(data){
if(data){
alert("注册成功!");
}
else{
alert("注册失败!");
}
}
</script>
</head>
<body>
<form name="regForm">
口 令：<input type="password" name="password"><br>
姓 名：<input type="text" name="name"><br>
<input type="button" name="submitBtn" value="提交" onclick="OnSave()"><br>
</form>
</body>
</html>
第七步：在WEB-INF文件下新建一个dwr.xml文件，该文件与web.xml同一目录。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>
<create creator="new" javascript="UserJs">
<param name="class" value="com.joyun.test.UserJs"/>
</create>
<convert converter="bean" match="com.joyun.test.User"/>
</allow>
</dwr>
第八步：编写web.xml。
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" 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_2_5.xsd">
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<display-name>DWR Servlet</display-name>
<description>Direct Web Remoter Servlet</description>
<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>scriptCompressed</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>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<login-config>
<auth-method>BASIC</auth-method>
</login-config>
</web-app>
第九步：发布项目。
第二节
项目说明我们从后面的步骤往前面讲。
第一步：web.xml配置文件的说明。
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<display-name>DWR Servlet</display-name>
<description>Direct Web Remoter Servlet</description>
<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>scriptCompressed</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>
我们通过servelet对dwr的请求拦截。<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>，其实这个类我们也可以用org.directwebremoting.servlet.DwrServlet代替。如果我们设置了debug为true的话，我们通过http://ip:port/webapp/dwr/index.html访问调试信息，如本项目中，我们这样访问：http://localhost:8080/test/dwr/index.html。
第二步：dwr.xml配置文件的说明。
dwr.xml文件的结构如下：
<!DOCTYPE dwr PUBLIC
"-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN"
"http://directwebremoting.org/schema/dwr30.dtd">
<dwr>
<!-- init is only needed if you are extending DWR -->
<init>
<creator id="..." class="..."/>
<converter id="..." class="..."/>
</init>
<!-- without allow, DWR isn't allowed to do anything -->
<allow>
<filter class="..."/>
<create creator="..." javascript="..."/>
<convert converter="..." match="..."/>
</allow>
<!-- you may need to tell DWR about method signatures -->
<signatures>
...
</signatures>
</dwr>
该文件中必须要有allow标签，否则dwr就不会接受从jsp页面传来的方法调用了。该文件的具体用法请参考dwr官网说明文档。
本项目中该文件的allow标签如下：
<allow>
<create creator="new" javascript="UserJs">
<param name="class" value="com.joyun.test.UserJs"/>
</create>
<convert converter="bean" match="com.joyun.test.User"/>
</allow>
其中creator="new"，说明用户每次访问该页面时都会创建一个新的实例。UserJs就是我们供前台页面调用的java类，该java类中有个save的方法。converter是类型转换，因为我们后台UserJS类的save方法参数是一个User对象。match就是要匹配转换的的User类的路径，即包名+类名。
第三步：index.jsp页面中，请注意js脚本。
<script type="text/javascript">
function OnSave(){
var user = {};
user.name = regForm.name.value;
user.password = regForm.password.value;
UserJs.save(user, saveFun);
}
function saveFun(data){
if(data){
alert("注册成功!");
}
else{
alert("注册失败!");
}
}
</script>
当用户在该页面点击<input type="button" name="submitBtn" value="提交" onclick="OnSave()"> 提交会触发OnSave脚本方法，
在脚本OnSave方法中我们生命了一个user对象，该对象有name和password两个属性，这两个属性的值是用户在输入框输入的值。OnSave方法中调用后台UserJs类的save方法进行保存，这里的save方法命名是有两个参数，而后台UserJs类的save只有一个user对象作为参数啊。其实这里就是dwr框架的使用了。dwr框架通过方法回传的这一解决办法类实现异步数据的交换。即在脚本中调用UserJs.save(user, saveFun);方法时，首先是到拦截器重，即我们再web.xml中配置的拦截器，经过拦截器处理后，通过回传的这种形式返回服务端的处理结果，而data就是服务端UserJs类的save方法的返回值。ps：本人水平有限，在这里讲的不是很明白，大家多多包涵或者自己到百度查阅更详细的资料。其实简单来讲js脚本中跟后台java类的交互中间还会通过dwr拦截，dwr拦截器会对其进行处理让服务端跟客户端进行数据交互，这就是为什么java程序员可以在不很了解设置不了解Ajax的情况下使用dwr框架能够进行异步数据交换，因为这部分的工作已经被dwr框架取代了。
另外在index.jsp中：
<script src="<%=basePath%>dwr/engine.js"></script>
<script src="<%=basePath%>dwr/util.js"></script>
<script src="<%=basePath%>dwr/interface/UserJs.js"></script>
这三个脚本的引入，其中前两个脚本是必须要引入的，后面的脚本是对应我们的java类，其中UserJs.js是我们再dwr.xml配置文件<create creator="new" javascript="UserJs"> javascript中对应的值，
第四步：UserJs类
该类就是供脚本js调用的类。
==========================================================================================
后记：在实际工作中，dwr框架通常都是跟ssh框架结合起来使用的！
更多dwr参考文档请访问：http://directwebremoting.org/dwr/documentation/index.html
=========================================================================================