DWR入門測試:
1、下載下傳dwr.jar,本人使用版本2.0.5
2、建立web項目,加入dwr的jar包至lib目錄下,根據需要可能還要加入commons-logging.jar
3、配置web.xml:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<!-- 配置dwr的listener -->
[color=red]<listener>
<listener-class>
org.directwebremoting.servlet.EfficientShutdownServletContextAttributeListener
</listener-class>
</listener>
<listener>
<listener-class>
org.directwebremoting.servlet.EfficientShutdownServletContextListener
</listener-class>
</listener>[/color]
<!-- 配置dwr的Servlet映射 -->
<servlet>
<!-- 指定DWR核心Servlet的名字 -->
<servlet-name>dwr-invoker</servlet-name>
<servlet-class>
<!-- 指定DWR核心Servlet的實作類 -->
org.directwebremoting.servlet.DwrServlet
</servlet-class>
<!-- 指定DWR核心Servlet處于調試狀态 -->
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<!-- 比對模式使用/dwr/*,其他的我沒有測試,有興趣可以試試 -->
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
</web-app>
4、建立業務邏輯類AjaxService.java以供頁面調用,我的了解是dwr架構是java類和javaScript的轉換橋梁,以提
供在view層直接調用java類暴露的相關方法,至于java類如何提供頁面調用的接口是由dwr.xml來配置的。
package com.zxm.ajax.dwrtest;
public class AjaxService {
// public String sayHello(String name) {
// // 可以是通路資料庫的複雜代碼
// return "歡迎您:" + name + ",恭喜DWR測試成功!";
// }
public AjaxService() {
}
public String getMyName(String v){
return "Hello Ajax,The Value is:" + v;
}
}
5、在WEB-INF下建立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标簽映射java類到javascript-->
<!-- creator="new"表示建立,javascript="MyTest"表示javascript的名字,scope="application"是作用域-->
<create creator="new" javascript="MyTest" scope="application">
<!-- 參數名 name="class"表示映射的是class,value是我們的業務邏輯類 -->
<param name="class" value="com.zxm.ajax.dwrtest.AjaxService" />
</create>
</allow>
</dwr>
6、view調用index.jsp:
<%@ page language="java" import="java.util.*" 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">
<html>
<head>
<base href="<%=basePath%>" target="_blank" rel="external nofollow" >
<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" target="_blank" rel="external nofollow" >
-->
<!-- 連結dwr為我們映射的javaScript檔案 -->
<!-- 名稱就是dwr.xml中指定的名稱MyTest,前面加上“dwr/interface/” -->
<script src="dwr/interface/MyTest.js"></script>
<!-- 連結dwr為我們提供的兩個js檔案,不要将其考到自己建立的檔案夾中 -->
<script src="dwr/util.js"></script>
<script src="dwr/engine.js"></script>
<!-- 頁面調用 -->
<%-- <script type="text/javascript">--%>
<%-- function myFirstDwr(){--%>
<%-- service.sayHello
(document.myform.user.value,callBackTest)--%>
<%-- }--%>
<%-- function callBackTest(data){--%>
<%-- alert(data);--%>
<%-- }--%>
<%-- </script>--%>
<!-- 頁面調用,正常編寫js代碼 -->
<script language="javascript">
var mycall=function callBack(data){
alert(data);
//使用dwr的函數将得到的傳回值填入id為nameTest的輸入框
DWRUtil.setValue("nameTest",data);
}
function showMyName(){
var v=document.getElementById("appValues").value;
//調用業務邏輯提供的接口,将傳回值交給回調函數mycall
MyTest.getMyName(v,mycall);
}
function clearName(){
nameTest.value="";
}
</script>
</head>
<body>
<%-- <form name="myform">--%>
<%-- <input type="text" name="user">--%>
<%-- <input type="button" name="button" value="test"--%>
<%-- οnclick="myFirstDwr();">--%>
<%-- </form>--%>
INPUT: <input type="text" id="appValues">
<br>
OUTPUT:<input type="text" id="nameTest">
<br>
<input type="button" value="showName" οnclick="javascript:showMyName()">
<input type="button" value="Clear" οnclick="javascript:clearName()">
</body>
</html>
7、部署運作:首先在IE中輸入[url]http://localhost:8080/TestDWR/dwr[/url]來測試dwr是否映射成功,如果成功,會顯示
如:MyTest (com.zxm.ajax.dwrtest.AjaxService),前面表示js名稱,括号裡的表示映射的類,點選MyTest會顯
示目前類的所有方法,包括繼承至Object的方法,可以找到相應的方法進行測試。然後在IE中輸入
[url]http://localhost:8080/TestDWR/index.jsp[/url]進行真正的測試,輸入相關值,點選相關按鈕會有相應的輸出并在後
台列印Exec: MyTest.getMyName()資訊,至此dwr入門示例完成。
ps:dwr還可以與其他架構內建,如spring,暫不讨論,文中被注釋的也是dwr測試,隻不過是不帶參數的,隻有一個回調函數。