DWR框架搭建以及使用

1，DWR介紹

DWR（Direct Web Remoting）是一個用於改善web頁面與Java類交互的遠程服務器端Ajax開源框架，可以幫助開發人員開發包含AJAX技術的網站。它可以允許在瀏覽器裏的代碼使用運行在WEB服務器上的JAVA函數，就像它就在瀏覽器裏一樣。

它包含兩個主要的部分:允許JavaScript從WEB服務器上一個遵循了AJAX原則的Servlet中獲取數據.另外一方面一個JavaScript庫可以幫助網站開發人員輕鬆地利用獲取的數據來動態改變網頁的內容.

2，安裝配置

2.1安裝dwr.jar包和commos-loggings.jar包

dwr.jar包是DWR框架的核心包。可在官網下載：

地址：http://directwebremoting.org/dwr/downloads/index.html

dwrdemo.war是官方提供的參考war包，有基本DWR框架的配置，也有dwr.jar包和commos-loggings.jar包。

2.2 配置wel.xml

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE web-app PUBLIC
    "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
    "http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app id="dwr">
  <servlet>
    <servlet-name>dwr-invoker</servlet-name>
    <display-name>DWR Servlet</display-name>
    <description>Direct Web Remoter Servlet</description>
    <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
    <init-param>
      <param-name>debug</param-name>
      <param-value>true</param-value>
    </init-param>
  </servlet>
  <servlet-mapping>
    <servlet-name>dwr-invoker</servlet-name>
    <url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>
</web-app>

規定這樣配置，複製即可。

注意：<url-pattern>/dwr/*</url-pattern>中的dwr就是頁面（下圖）的src路徑中dwr。

2.3 dwr.xml配置

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
<dwr>

<allow>
        <!--配置的一個演示類，javascript="test" 表示可以在頁面中用test這個名稱指向DwrTest這個java類，類中的方法可以在前臺調用 -->
        <!-- creater="new"表示每調用一次時,都需要new一個 -->
        <create creator="new" javascript="test">
            <param name="class" value="com.dwr.DwrTest" />
        </create>
        <!-- 配置javaBean類 -->
       <convert match="com.dwr.User" converter="bean"/>  
    </allow>
</dwr>

dwrdemo.war包中有配置模板，可以複製過來做修改即可。

2.4 jsp頁面配置

jsp頁面如果要使用DWR框架，需提交上圖的代碼，src路徑中的dwr是web.xml文件中<url-pattern>/dwr/*</url-pattern>節點的dwr.       engine.js,util.js,interface是規定格式，test是dwr.xml配置文件javascript屬性的值test。

以下是dwr.xml配置的補充，瞭解即可。

<create>標籤是dwr中重要的標籤，用來描述java（服務器端） 與javascript （客戶端）的交互方式。其基本格式如下：

<allow>

  <create creator="..." javascript="..." scope="...">
	
    <param name="..." value="..."/>

    <auth method="..." role="..."/>

    <exclude method="..."/>

    <include method="..."/>

  </create>
	...

</allow>

creator屬性 是必須的 -它用來指定使用那種創造器。

默認情況下DWR1.1有8種創造器。它們是：

· new: 用Java的new關鍵字創造對象。

· none: 它不創建對象，看下面的原因。 (v1.1+)

· scripted: 通過BSF使用腳本語言創建對象，例如BeanShell或Groovy。

· spring: 通過Spring框架訪問Bean。

· jsf: 使用JSF的Bean。 (v1.1+)

· struts: 使用Struts的FormBean。 (v1.1+)

· pageflow: 訪問Beehive或Weblogic的PageFlow。 (v1.1+)

 

如果你需要寫自己的創造器，你必須在init部分註冊它。

javascript屬性 用於指定瀏覽器中這個被創造出來的對象的名字。你不能使用Javascript的關鍵字。

scope屬性 非常類似servlet規範中的scope。它允許你指定這個bean在什麼生命範圍。選項有"application", "session", "request" 和"page"。這些值對於Servlet和JSP開發者來說應該相當熟悉了。

scope屬性是可選的。默認是"page"。如果要使用"session"需要cookies。當前的DWR不支持ULR重寫。

param元素 被用來指定創造器的其他參數，每種構造器各有不同。例如，"new"創造器需要知道要創建的對象類型是什麼。每一個創造器的參數在各自的文檔中能找到。請查看上面的鏈接。

include和exclude元素 允許創造器來限制類中方法的訪問。一個創造器必須指定include列表或exclude列表之一。如果是include列表則暗示默認的訪問策略是"拒絕"；如果是exclude列表則暗示默認的訪問策略是"允許"。

例如要拒絕防範除了setWibble()以外的所有方法，你應該把如下內容添加到dwr.xml中。

<create creator="new" javascript="Fred"> <param name="class" value="com.example.Fred"/> <include method="setWibble"/></create>

對於加入到create元素中的類的所有方法都是默認可見的。

auth元素 允許你指定一個J2EE的角色作爲將來的訪問控制檢查:

<create creator="new" javascript="Fred"> <param name="class" value="com.example.Fred"/> <auth method="setWibble" role="admin"/></create>

3，DWR的簡單使用

3.1 java DWR實現類DwrTest

package com.dwr;

import java.util.List;
import java.util.Map;
/***
 * DWR的實現類
 * @author ZhongBingLin
 *
 */
public class DwrTest {
	/**
	 * 
	 * @param list 存有實體類User對象的list對象  頁面傳過來的值
	 * @return list 存有實體類User對象的list對象  在頁面可以得到
	 */
	public List<User> list(List<User> list)
	{
		for (User user : list) {
			System.out.println(user.toString());
		}
		return list;
	}
	/**
	 * 
	 * @param map Map<String,User>對象  頁面傳過來的值
	 * @return map Map<String,User>對象  在頁面可以得到
	 */
	public Map<String,User> map(Map<String,User> map)
	{
		for (String str: map.keySet()) {
			System.out.println(str+","+map.get(str).toString());
		}
		return map;
	}
}

3.2 javaBean類User

package com.dwr;

public class User {
	private int id;
	private String name;
	private String addr;
	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 getAddr() {
		return addr;
	}
	public void setAddr(String addr) {
		this.addr = addr;
	}
	public String toString() {
		return "[id=" + id + ", name=" + name + ", addr=" + addr + "]";
	}	
}

3.3 Jsp頁面 test.jsp

<%@ 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 test</title>
<script type="text/javascript" src="<%=request.getContextPath()%>/dwr/engine.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/dwr/util.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/dwr/interface/test.js"></script>
</head>
<script type="text/javascript">
function list()
{
	var a = {id:1,name:"肖亮亮",addr:"湖南永州"};
	var b = {id:2,name:"唐爲強",addr:"廣東深圳"};
	test.list([a,b],function(userList)
	{
		 for(var i=0;i<userList.length;i++){
		     alert("id="+userList[i].id+",name="+userList[i].name+",addr="+userList[i].addr);
		  }
	});
}
function map()
{
	var a = {id:1,name:"肖亮亮",addr:"湖南永州"};
	var b = {id:2,name:"唐爲強",addr:"廣東深圳"};
	test.map({"id1":a,"id2":b},function(userMap){
		for(var key in userMap){
			alert(key+": "+userMap[key].id+","+userMap[key].name+","+userMap[key].addr);
		}
	});
}
</script>
<body>
	<button onclick="list()">list</button>
	<button onclick="map()">map</button>
</body>
</html>

3.4頁面效果

圖1：    

圖2：

頁面點擊list按鈕觸發事件，js中test對象調用了DwrTest類的list方法，打印圖1效果，傳了一個參數list對象，返回值userList傳入回調函數，在函數中跳出圖效果。

點擊map按鈕有類似效果，這裏就不再描述了。