SSH2+dwr

很早之前就想寫博客，可是一直沒動手。這兩天閒的無聊又玩起了搭框架的“遊戲”，搭完才發現真的是“好記性不如爛筆頭”，很多東西都忘了，遂下定決心開始寫博客。

在講SSH2和dwr框架融合之前，先簡單介紹下dwr框架以及dwr單獨搭建的方法。

Dwr作用：它是一個可以允許你去創建AJAX WEB站點的JAVA開源庫。它可以讓你在瀏覽器中的Javascript代碼調用Web服務器上的Java代碼，就像在Java代碼就在瀏覽器中一樣。Dwr原理：在安裝DWR時會在web.xml中配置一個servlet，這個servlet負責把前臺的JS參數封裝成JAVA，去調用你的JAVA類，然後將返回結果（JAVA類型）再翻譯成JS生成到你的JSP頁面上，給你的錯覺就是你用JS直接調用了JAVA方法。

1. 搭建dwr

a.從DWR官網下載最新版本的jar包，地址：http://directwebremoting.org/dwr/downloads/index.html。（筆者所用的是dwr3.0. 當前最穩定的版本是dwr2.0。）新建web工程，將jar包放入WEB-INF的lib文件夾下，這裏要注意，dwr依賴於commons-logging.jar這個包，所以必須將這個jar包也放入到WEB-INF的lib文件夾下，否則會報Allocate exception for servlet dwr-invoker錯誤。

b. 配置dwr的環境

第一步，修改web.xml，在web.xml裏添加Servlet映射，具體代碼如下：

<?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">
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
  <!--DWR Servlet config -->
	<servlet>
		<!-- Dwr2.0之後配置前端攔截器由uk.ltd.getahead.dwr.DWRServlet換爲了org.directwebremoting.servlet.DwrServlet -->
		<servlet-name>dwr-invoker</servlet-name>
		<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
		<init-param>
		<!-- 這個是調試用，如果正式發佈請該爲false -->
			<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>

第二步，新建dwr.xml，配置允許js調用的class，具體代碼如下：

<?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>
    <!-- create元素中，creater="new"表示每調用一次DWRUserAccess時，需要new一個這樣的類；
	這是我配置的一個演示類，javascript="Demo" ,表示我可以在頁面中用Demo這個名稱指向DwrTest這個java類，類中的方法可以在前臺調用-->  
    
    <create creator="new" javascript="Demo">  
      <param name="class" value="cn.hfut.DwrTest"/>  
      <!-- 加include可以具體指定java類中關的方法，不加則默認允許訪問所有公佈類的public方法，
      	在我的例子中，爲了讓大家瞭解include的作用我只允許訪問getHello方法。-->
      <include method="getHello"/>  
    </create>  
    
  	<!--  <convert>標籤是將converter中定義的轉換器映射到的具體類型 -->
    <!-- this is a bad idea for live, but can be useful in testing 
    <convert converter="exception" match="java.lang.Exception"/>
    <convert converter="bean" match="java.lang.StackTraceElement"/>
	-->
	
  </allow>

</dwr>

第三步，新建dwr.xml中配置的業務類cn.hfut.DwrTest，具體java代碼如下：

package cn.hfut;
/**
 * @author Tony
 * @date : 2014-2-15 下午06:44:23
 */
public class DwrTest {
    public String getHello(String name) {  
        return "hello" + name;  
    }
    public String getWorld(String name) {  
        return "world" + name;  
    }
}

第四步，編寫測試的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>
    	<title>Dwr Demo</title>
    	<!-- dwr config -->
    	<!-- jsp文件中必須引入幾個js,它們都是隱含存在的，不用考慮它們在哪兒。
    	其中engine.js和util.js是固定的。最後一個js的名稱要與dwr.xml中配置的javascript名一致。 -->
		<script type='text/javascript' src='<%=path%>/dwr/engine.js'> </script>
		<script type='text/javascript' src='<%=path%>/dwr/util.js'> </script>
		<script type='text/javascript' src='<%=path%>/dwr/interface/Demo.js'> </script>
		
		<script type="text/javascript">
		//此函數中可以調用java類的方法，除了java方法本身的參數外，還要將回調函數名作爲參數傳給java方法
		function sayHello(name){
			Demo.getHello(name,dwrHandler);//這裏只能使用dwr.xml中暴露的方法
		}
		
		//這是dwr的一個回調函數，data參數即java方法getHello(String name)的返回值
		function dwrHandler(data){
			alert(data);
		}
		</script>
  	</head>
  
	<body>  
		<h1>Hello World!</h1>
		<script type="text/javascript">
			sayHello("DWR");
		</script>
	</body>
</html>

使用dwr千萬不要忘記上述三個js文件，然後書寫相應的javascript代碼，用來實現ajax。

至此，dwr框架已經搭建完畢。訪問index.jsp即會alert相應內容。或者在項目路徑後面加上 /dwr/,如http://127.0.0.1:8080/Dwr1/dwr/，可進入debug頁面

2. dwr+ssh2

簡單瞭解了dwr，下面我們講講SSH2中怎麼使用dwr。

a.首先建立一個SSH2項目，限於篇幅這篇博文就略過了；

b.dwr.xml.在WEB-INF下面新建dwr.xml。因爲整個SSH2應用是基於Spring框架管理bean的，所以DWR就不能自己創建JavaBean了，也就是說DWR需要從Spring容器個取得bean。爲了實現這個目標，在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>
	<!-- dwr中創建轉換對象的方式如下： -->
  	<allow>
  		<!-- 因爲要使用ssh2框架，所以將bean的創建交給spring，而不是之前的class -->
	  	<create  creator="spring" javascript="demo" scope="application">
	  		<!-- param中name因爲要調用bean中的方法，所以使用beanName,value是struts.xml中配置的業務類 -->
	  		<param name="beanName"  value="userAction"></param>		
		</create>
		
  		<!--  <convert>標籤是將converter中定義的轉換器映射到具體類型 ，即將match路徑下的User轉換成bean，供上述的beanName使用-->		
  		<convert converter="bean" match="cn.hfut.ssh.model.User"/>
  		
  	</allow>
</dwr>

c.web.xml.在已經配好的SSH2的web.xml中加入dwr Servlet的配置，這部分和之前的一樣。

d.前臺測試頁面dwr.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>
    <title>DWR+SSH2</title>
    <script type="text/javascript" src="<%=path%>/js/jquery-1.6.2.js"></script>
    <link rel="stylesheet" type="text/css" href="<%=path%>/css/style.css"/>
	<!-- DWR測試 -->
	<script type="text/javascript" src="<%=path%>/dwr/util.js"></script>
	<script type="text/javascript" src="<%=path%>/dwr/engine.js"></script>
	<script type="text/javascript" src="<%=path%>/dwr/interface/demo.js"></script><!-- 這個js必須在engine.js之後，不然瀏覽器會報錯 -->

<!-- 
	<script language="javascript" type="text/javascript">
	function test(){
		demo.findUser(dwrHandler);
	}

	//這是dwr的一個回調函數，user參數即UserAction裏面findUser()的返回值，名稱是隨便取的，可以是data
	//這裏的user不能少，少了會提示user is not defined
	function dwrHandler(user){
		alert(user.id+","+user.username+","+user.password);
	}	
	</script>
 -->
	<script type="text/javascript">
		$(document).ready(function(){
			$("button").click(function(){
				demo.findUser(dwrHandler);
			});
		});
		
		function dwrHandler(user){
			//alert(user.id+","+user.username+","+user.password);
			//$("#one").css("background","blue");
			$("#c").html(user.id+","+user.username+","+user.password);
		}
	</script>
 	
  </head>
  
  <body>
    
    <div id="main">
      	<div id="left">
      		<button type="button">SSH2+DWR測試</button>
      	</div>
  		<div id="c"></div>
    </div>
  </body>
</html>

結束語：感謝CCTV，感謝。。。V。。。大功告成啦~雖然框架搭好了，但是對於dwr還有很多要學的地方，比如網上一些例子中說的struts.xml也需要配置，在我這個搭建過程中根本沒涉及到。所以只能說可以簡單的使用dwr了，更深入的問題相信隨着使用會逐漸碰到。希望我這篇博文對dwr初學者能起到一點幫助。^_^

代碼下載地址：1.dwr3.0搭建

2.dwr3.0+SSH2

測試人員都是畫畫大神，讓我看看誰還不會用代碼圖？

Maven入門篇（下）

SSH2+dwr

配置xml時一些jar和命名空間問題，如mvc:annotation-driven

myeclipse8.5 啓動時不彈出工作空間的選擇

深入分析ClassLoader

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結