首先導入項目所須要的包,以下:dwr.jar,commons-logging-1.0.4.jar,版本能夠調整javascript
1.web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.4"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">html
<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>java
</web-app>web
2.DWRTest.java
package com.micro;spring
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;數組
@SuppressWarnings("unchecked")
public class DWRTest {app
/**
* 第一個簡單調用
*/
public String getStr() {
return "第一個dwr示例,調用成功";
}jsp
/**
* 帶傳遞參數的調用,返回String
*/
public String getInfo(String name, int age, String address) {
return "個人名字叫" + name + ",現年" + age + "歲," + "來自" + address;
}函數
/**
* 返回數組Array
*/
public String[] getStrArray() {
return new String[] { "one", "two", "three", "go!" };
}測試
/**
* 返回集合List
*/
public List getList() {
List list = new ArrayList();
list.add("welcome");
list.add("to");
list.add("BeiJing");
return list;
}
/**
* 返回Map類型
*/
public Map getMap() {
Map map = new HashMap();
map.put("name", "周星星");
map.put("hobby", "逃課");
return map;
}
/**
* 返回二維數組類型
*/
public List getArrayList() {
List list = new ArrayList();
list.add(new String[] { "1", "2", "3" });
list.add(new String[] { "one", "two", "three", "four", "five" });
return list;
}
/**
* Exception處理
*/
public List getListTest(List list) {
try {
list.get(0);
} catch (Exception e) {
throw new NullPointerException("數據位空");
}
return list;
}
}
3.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>
<!-- 調用不一樣的方法,返回不一樣的數據類型 -->
<create javascript="dwr" creator="new">
<param name="class" value="com.micro.DWRTest" />
</create>
<!-- 類型轉換爲JavaBean的處理 -->
<create javascript="dwrBean" creator="new" scope="request">
<param name="class" value="com.micro.UserRs" />
</create>
<convert match="com.micro.User" converter="bean">
<param name="include" value="name,pass" />
</convert>
<!-- 異常Exception的處理 ,默認狀況下dwr對異常的處理就是一個彈出框提示爲Error-->
<create javascript="dwrException" creator="new">
<param name="class" value="com.micro.DWRTest" />
</create>
<convert match="java.lang.NullPointerException" converter="exception" />
</allow>
</dwr>
4.mydwr.js
/**
* 無參數
*/
function invoke1(){
dwr.getStr(
function(value){
alert(value);
}
);
}
/**
* 有參數
*/
function invoke2(){
dwr.getInfo("長江七號",3,"火星",
function(value){
alert(value);
}
);
}
/**
* 返回數組
*/
function invoke3(){
dwr.getStrArray(
function(array){
var str="";
for(var i=0;i<array.length;i++){
str += array[i]+" ";
}
alert(str);
}
);
}
/**
* 返回集合(集合和數組的處理方式同樣)
*/
function invoke4(){
dwr.getList(
function(list){
var str="";
for(var i=0;i<list.length;i++){
str += list[i];
}
alert(str);
}
);
}
/**
* 返回Map
*/
function invoke5(){
dwr.getMap(
//有以下兩種處理方式
/*1)已知map的key*/
function(map){
alert("姓名:"+map.name+",愛好:"+map.hobby);
}
/*2).遍歷的方式
function(map){
for(var key in map){
alert(key+":"+map[key]);
}
}*/
);
}
/**
* 返回數組的集合(二維數組)
*/
function invoke6(){
dwr.getArrayList(
function(arrayList){
var str="";
for(var i=0;i<arrayList.length;i++){
for(var j=0;j<arrayList[i].length;j++){
str += arrayList[i][j];
}
str+="\n\r";
}
alert(str);
}
);
}
/**
* 同步設置
*/
function invoke7(){
dwr.engine.setAsync(false);//設置同步,那麼後續的方法才能按照順序執行
invoke1();
invoke2();
}
/**
* 批處理batch(按照前後順序執行)
*/
function invoke8(){
dwr.engine.beginBatch();
invoke1();
invoke2();
dwr.engine.endBatch();
}
5.index.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='dwr/interface/dwr.js'></script>
<script type="text/javascript" src="mydwr.js"></script>
</head>
<body>
<input type="button" value="DRW1" onclick="invoke1()" />
<br />
<input type="button" value="DRW2" onclick="invoke2()" />
<br />
<input type="button" value="DRW3" onclick="invoke3()" />
<br />
<input type="button" value="DRW4" onclick="invoke4()" />
<br />
<input type="button" value="DRW5" onclick="invoke5()" />
<br />
<input type="button" value="DRW6" onclick="invoke6()" />
<br />
<input type="button" value="DRW7" onclick="invoke7()" />
<br />
<input type="button" value="批處理測試" onclick="invoke8()" />
</body>
</html>
上述,index.jsp頁面就對上述各類dwr的返回類型和批處理(batch)作了處理,作了簡單的測試,Ok,測試經過,下面再介紹幾個頁面,
對dwr其餘功能的一些簡單測試:
6.異常處理:exception.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='dwr/interface/dwrException.js'></script>
<script type="text/javascript" src="mydwr.js"></script>
<script type="text/javascript">
function convert(){
var list;
dwrException.getListTest(list,
{
exceptionHandler:function(msg){
alert(msg);
},
callback:function(data){
alert(data);
}
}
);
}
</script>
</head>
<body>
<input type="button" value="異常測試" onclick="convert()"/>
</body>
</html>
7.dwr.util.getValue()調用,dwrfunc.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='dwr/interface/dwr.js'></script>
<script type="text/javascript" src="mydwr.js"></script>
</head>
<body>
<input type="text" name="name" id="nameid" />
<br/>
<input type="button" value="EL經過id取值" onclick="alert(${'nameid'}.value)" />
<br />
//若是要是有dwr.util提供的功能,必須引入dwr/util.js文件,dwr3以後,有寫函數內寫name或id均可以
<br/>
<input type="button" value="dwr.util經過id" onclick="alert($('nameid').value)" />
<br />
<input type="button" value="dwr.util經過name" onclick="alert($('name').value)" />
<br />
<input type="button" value="dwr.util經過name/id" onclick="alert(dwr.util.getValue('name'))" />
<br />
</body>
</html>
8.對JavaBean的傳遞和返回
User.java:
package com.micro;
public class User {
private String name;;
private String pass;
//get/set方法....
}
UserRs.java:
package com.micro;
public class UserRs {
public User convertUser(User user) {
user.setName("admin");
user.setPass("123456");
return user;
}
}
bean.jsp:
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='dwr/interface/dwrBean.js'></script>
<script type="text/javascript" src="mydwr.js"></script>
<script type="text/javascript">
function convert(){
var uname = $("name").value;
var upass = $("pass").value;
var obj = {name:uname,pass:upass};
dwrBean.convertUser(obj,function(data){
$("uname").value = data.name;
$("upass").value = data.pass;
});
}
</script>
</head>
<body>
<input type="text" name="name" id="uname" value="you name"/><br/>
<input type="text" name="pass" id="upass" value="your password"/><br/>
<input type="button" value="測試處理" onclick="convert()"/>
</body>
</html>
這些,只是對dwr的簡單應用,其中的配置都在dwr.xml中,你們能夠觸類旁通,一般狀況下,dwr和spring要結合使用,下面給出一個簡單的配置說明:
好比:
<!-- 驗證登錄名是否存在 -->
<create creator="spring" javascript="loginServiceDWR" scope="request">
<param name="beanName" value="coreLoginService" />
<include method="checkLogin" />
</create>
其中,creator="spring",代表由spring來建立該對象,javascript="loginServiceDWR",說明客戶端的調用名稱叫"loginServiceDWR",<param name="beanName" value="coreLoginService" />指明瞭spring配置文件中,id爲"coreLoginService"的這麼一個bean,<include method="checkLogin" />,對外公開的方法是"checkLogin" ,調用過程同上述其餘類型調用相同,不一樣就是配置而已。上述代碼,僅供參考。
注意:引入dwr的js文件的順序不能錯了,如:
<script type='text/javascript' src='dwr/engine.js'></script>
<script type='text/javascript' src='dwr/util.js'></script>
<script type='text/javascript' src='dwr/interface/dwrBean.js'></script>
先引入dwr自身的,再引入本身的。