DWR框架入門教程2009-10-2017:01DWR（DirectWebRemoting）是一個開放源碼的使用Apache許可協(xié)議的解決方案，它包含服務(wù)器端Java庫、一個DWRServlet以及JavaScript庫。雖然DWR不是Java平臺上唯一可用的Ajax-RPC工具包，但是它是最成熟的，而且提供了許多有用的功能。為什么要使用DWR，我們首先介紹基本AJAX流程，從中可以看到引入DWR會帶來什么好處。

1、AJAX的基本介紹

Ajax(AsynchronousJavaScriptAndXML)描述了一種使用混合了HTML(或XHTML)和層疊樣式表作為表達信息,來創(chuàng)建交互式的Web應(yīng)用的開發(fā)技術(shù);文檔對象模型（DOM）、JavaScript、動態(tài)地顯示和與表達信息進行交互;并且，XMLHttpRequest對象與Web服務(wù)器異步地交換和處理數(shù)據(jù)。

使用AJAX，我們可以開發(fā)出有很好交互性的B/S程序，同時AJAX局部和異步刷新的特性也大大減小了對服務(wù)器和網(wǎng)絡(luò)的壓力。對于非AJAX的B/S程序來說HTML、DOM、JS同樣是不可或缺的關(guān)鍵技術(shù)，因此引入AJAX技術(shù)主要是增加了對于XMLHttpRequest對象的使用。我們使用AJAX來開發(fā)一個簡單的AJAX程序。

例1：

服務(wù)端的TestAjaxServlet:publicvoiddoPost(HttpServletRequestreq,HttpServletResponseres)throwsjava.io.IOException{res.getWriter().write("GettingMessageusesAJAXdirectly!");}

請將些Servlet配置成ajax/testAjaxServlet.

客戶端的使用AJAX去調(diào)用服務(wù)端的TestAjaxServlet并響應(yīng)：functiongetAjaxMessage(){varhttp_request=false;if(window.XMLHttpRequest){//Mozilla,Safari,...http_request=newXMLHttpRequest();if(http_request.overrideMimeType){http_request.overrideMimeType("text/html");}}else{if(window.ActiveXObject){//IEtry{http_request=newActiveXObject("Msxml2.XMLHTTP");}catch(e){try{http_request=newActiveXObject("Microsoft.XMLHTTP");}catch(e){}}}}if(http_request===false){alert("CannotcreateXMLHTTPinstance");returnfalse;}http_request.onreadystatechange=function(){document.getElementById(‘MessageSpan’).innerHTML=http_request.responseText;};http_request.open("POST",“ajax/testAjaxServlet.do“,true);http_request.setRequestHeader("Content-type","application/x-www-form-urlencoded");http_request.setRequestHeader("Content-length",parameters.length);http_request.setRequestHeader("Connection","close");http_request.send(parameters);}

當客戶端調(diào)用getAjaxMessage()成功后，頁面上的“MessageSpan”部分會出面“GettingMessageusesAJAXdirectly!”，表明調(diào)用成功，且頁面沒有整體全部的刷新，在處理沒有完成的時候，用戶和頁面上其它的UI交互并不受影響。

與傳統(tǒng)B/S開發(fā)方法相比，服務(wù)端代碼沒有受到影響，客戶端使用則需要創(chuàng)建XMLHttpRequest對象與服務(wù)端進行交互，同時在服務(wù)端調(diào)用完成后，使用JS回調(diào)函數(shù)處理服務(wù)端返回的數(shù)據(jù)。AJAX為B/S程序帶來了種種好處的同時，也帶來了下列問題，一是需要使用XMLHttpRequest對象，二是如果服務(wù)端想要返回一個復(fù)雜的數(shù)據(jù)結(jié)構(gòu)時，一般只能返回XML代碼，雖然有很多相對應(yīng)的工具來解析XML，但還是增加了較大的工作量，有沒有一種方法或工具，能夠封裝XMLHttpRequest，屏蔽HTTP協(xié)議細節(jié)，不會對服務(wù)端的代碼造成影響，同時能讓將服務(wù)端返回的復(fù)雜數(shù)據(jù)結(jié)構(gòu)隱式轉(zhuǎn)換為客戶端JS程序可以直接使用的數(shù)據(jù)結(jié)構(gòu)？有，答案就是DWR。

2、DWR框架基本介紹

從最簡單的角度來說，DWR是一個引擎，可以把服務(wù)器端Java對象的方法公開給JavaScript代碼。使用DWR可以有效地從應(yīng)用程序代碼中把Ajax的全部請求-響應(yīng)循環(huán)消除掉。這意味著客戶端代碼再也不需要直接處理XMLHttpRequest對象或者服務(wù)器的響應(yīng)。不再需要編寫對象的序列化代碼或者使用第三方工具才能把對象變成XML。甚至不再需要編寫servlet代碼把Ajax請求調(diào)整成對Java域?qū)ο蟮恼{(diào)用。

DWR是作為Web應(yīng)用程序中的servlet部署的。把它看作一個黑盒子，這個servlet有兩個主要作用：首先，對于公開的每個類，DWR動態(tài)地生成包含在Web頁面中的JavaScript。生成的JavaScript包含存根函數(shù)，代表Java類上的對應(yīng)方法并在幕后執(zhí)行XMLHttpRequest。這些請求被發(fā)送給DWR，這時它的第二個作用就是把請求翻譯成服務(wù)器端Java對象上的方法調(diào)用并把方法的返回值放在servlet響應(yīng)中發(fā)送回客戶端，編碼成JavaScript。DWR的標準流程如下圖所示：

頁面觸發(fā)eventHandler()事件，事件內(nèi)部調(diào)用了AjaxService.getOptions方法，當調(diào)用完成后，利用服務(wù)端返回的數(shù)據(jù)用客戶端的populateList()方法進行數(shù)據(jù)展現(xiàn)。

我們通過一個簡單的DWR示例來說明如何使用DWR。

為了使用DWR，需要將DWR的jar文件拷入Web應(yīng)用的WEB-INF/lib目錄中（可在/dwr下載），在web.xml中增加一個servlet聲明，并創(chuàng)建DWR的配置文件。

服務(wù)端的配置：<servlet><servlet-name>dwr-invoker</servlet-name><display-name>DWRServlet</display-name><description>DirectWebRemoterServlet</description><servlet-class>uk.ltd.getahead.dwr.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-INF中創(chuàng)建文件dwr.xml：<?xmlversion="1.0"encoding="UTF-8"?><!DOCTYPEdwrPUBLIC"-//GetAheadLimited//DTDDirectWebRemoting2.0//EN""/dwr/dwr20.dtd"><dwr><allow></allow></dwr>

服務(wù)端的TestDWR:publicStringgetMessage(){return"GettingMessageusesDWR!";}

在dwr.xml的<allow></allow>中增加如下內(nèi)容：<createcreator="new"javascript="TestDWR"><paramname="class"value="ajax.TestDWR"/></create>

至此，服務(wù)端的配置已經(jīng)完成，如果有新的功能增加，只需要對在dwr.xml中進行相應(yīng)的配置即可。

客戶端的配置：

如果頁面要使用DWR，需要將下面三行引入：

<scriptsrc='/[YOUR-WEBAPP]/dwr/interface/[YOUR-SCRIPT].js'></script>

<scriptsrc='/[YOUR-WEBAPP]/dwr/engine.js'></script>

在頁面中增加如下代碼定義JS函數(shù)：<script>functiongetDWRMessage(){TestDWR.getMessage(showMessage);}functionshowMessage(data){document.getElementById(‘MessageSpan’).innerHTML=data;}</script>

當客戶端調(diào)用getDWRMessage()成功后，頁面上的“MessageSpan”部分會出面"GettingMessageusesDWR!"，表明DWR調(diào)用成功，且頁面沒有整體全部的刷新，在處理沒有完成的時候，用戶和頁面上其它的UI交互并不受影響。

對例1和例2進行對比，我們可以發(fā)現(xiàn)使用DWR開發(fā)B/S應(yīng)用時，DWR為我們屏蔽了HTTP協(xié)議的細節(jié)，不再需要使用XMLHttpRequest對象來與服務(wù)器進行交互，解決了我們在編寫AJAX應(yīng)用時一個較大的問題，但在例2中我們中只返回了一個簡單的字符串，如果我們希望返回一個較復(fù)雜的數(shù)據(jù)結(jié)構(gòu)，如一個對象數(shù)組，DWR又如何解決這個問題呢？

例3：

定義一個JavaBean:publicclassUser{privateStringusername;privateStringpassword;publicStringgetUsername(){returnusername;}publicvoidsetUsername(Stringusername){this.username=username;}publicStringgetPassword(){returnpassword;}publicvoidsetPassword(Stringpassword){this.password=password;}}

在dwr.xml的<arrow></arrow>間增加如下內(nèi)容：<convertconverter="bean"match="ajax.User"></convert>

在現(xiàn)有的服務(wù)端代碼中增加一個方法：publicArrayListgetUserList(){ArrayListuserList=newArrayList();UseruserA=newUser();userA.setUsername("John");userA.setPassword("123456");userList.add("userA");UseruserB=newUser();userB.setUsername("Tom");userB.setPassword("123456");userList.add("userB");returnuserList;}

在客戶端，我們增加一個JS函數(shù)來調(diào)用服務(wù)端的getUserList方法FunctiongetUserListFromServer(){Util.getUserList({callback:function(dataFromServer){for(vari=0;i<dataFromServer.length;i++){alert(dataFromServer[i].username);}}});}

當觸發(fā)頁面的getUserListFromServer方法后，“John”，“Tom”順序顯示，這樣，我們直接使用服務(wù)端定義的一個對像數(shù)組，就像js中定義的一樣，不需要我們手工進行轉(zhuǎn)換。

3、DWR框架的缺點

通過上面的示例程序，我們可以看到使用DWR開發(fā)B/S程序給我們帶來了很大的便利，但任何技術(shù)都有不足之處，對這些不足之處的充分了解，有助于我們更好的理解DWR的適用范圍，發(fā)揮它的優(yōu)點。

同任何RPC機制一樣，在DWR中，可能很容易忘記對于遠程對象進行的每個調(diào)用都要比本地函數(shù)調(diào)用昂貴得多。DWR在隱藏Ajax的機械性方面做得很好，但是重要的是要記住網(wǎng)絡(luò)并不是透明的——進行DWR調(diào)用會有延遲，我們不能因為某些實現(xiàn)上的問題，將完全可由客戶端完成的功能轉(zhuǎn)交服務(wù)端完成，這樣會導致服務(wù)器和網(wǎng)絡(luò)增加了不必要的開銷。