?????? 首先,我們討論什么是真正的DWR。DWR是Direct Web Remoting的縮寫,是Java和JavaScript相結合的開源庫。通過它,可以簡單、容易地構建Ajax程序,無需深入了解XMLRequest的編碼 細節。它容許你通過客戶端的JavaScript,采用看似調用瀏覽器本地代碼的方法來調用服務器端的代碼。這就是DWR的直接含義。相對DWR提高的各種強大功能而言,其體系結構卻非常簡單。 下面一幅精確的圖概要說明了DWR的運行機制。
????? ?在圖的左側有一個evenHandler()函數,他調用了AjaxService對象中的getOption()方法。這段代碼看上去是執行一段位于本地JavaScript對象的方法,但事實上卻是調用服務器上運行的 一個Java對象的方法。看代碼時,你無法識別這一點,我認為這是DWR的一大優點。 傳送給方法populateList()的參數是另一個JavaScript函數,這是回調函數。它會在遠程調用結果返回時 執行,因此帶箭頭的循環說明雙向數據流動。
????? 下面我們來實現一個簡單的DWR實例——基本四則運算。 首先應先配置:到官網下載頁面可以發現3個文件,分別是dwr.jar、DWR完整源代碼、和dwr.war。dwr.jar是最簡潔且必須的,如果時間充裕的話,也許希望將dwr.war下載下來。該程序 是DWR的一個小的范例程序,演示了許多DWR功能(包括聊天程序、基于郵政編碼自動調入詳細地址信息并進行快速地址查詢、采用GI的實時股票報價等)。
????? 將dwr.jar,放到工程的WEB-INF/lib目錄下,讓后配置web.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>
<!-- intro - for the test on index.html -->
<create creator="new" javascript="MathDelegate">
<param name="class" value="cn.dwr.test.MathDelegate"/>
</create>
</allow>
</dwr> ??
????? ?然后在工程中建立一個Java類:
package cn.dwr.test;
/**
* 簡單的加減乘除四則運算類,用于測試第一個DWR
* @author Sephiroth
*
*/
public class MathDelegate {
/**
* 兩個數相加
*/
public int add(int a,int b){
return a+b;
}
/**
* 兩個數相減
*/
public int subtract(int a,int b){
return a-b;
}
/**
* 兩個數相乘
*/
public int multiply(int a,int b){
return a*b;
}
/**
* 兩個數相除
*/
public int divide(int a,int b){
if(b!=0){
return a/b;
}else{
return 0;
}
}
}
?????? ?細心的你們也許發現這端代碼不夠穩健,之排查了除0的錯誤,這樣做也是為了示例代碼的簡潔而已。
??????? 接著在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>
<!-- intro - for the test on index.html -->
<create creator="new" javascript="MathDelegate">
<param name="class" value="cn.dwr.test.MathDelegate"/>
</create>
</allow>
</dwr>
????? 該文件目前在這實例中只完成一個任務,就是告訴DWR哪些類可以被遠程訪問,本例僅有MathDelegate類。可以為用于表示服務器端對象的JavaScript對象重新指定名稱,但是通常情況二者取同名,本例就是如此。
???
????? 最后,附上本示例的唯一而簡潔的頁面index.html代碼:
<html>
<head>
<title>FirstDWR</title>
<script type="text/javascript" src="dwr/interface/MathDelegate.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script>
var a=0;
var b=0;
var op="";
function doMath(){
a=document.getElementById("numA").value;
b=document.getElementById("numB").value;
op=document.getElementById("op").value;
if(op=="add"){
MathDelegate.add(a,b,doMathCallBack);
op="+";
}else if(op=="subtract"){
MathDelegate.subtract(a,b,doMathCallBack);
op="-";
}else if(op=="multiply"){
MathDelegate.multiply(a,b,doMathCallBack);
op="*";
}else if(op=="divide"){
MathDelegate.divide(a,b,doMathCallBack);
op="/";
}
}
var doMathCallBack=function(answer){
document.getElementById("resultDiv").innerHTML="<h1>"+"Result:"+a+""+op+""+b+"="+answer+"</h1>";
}
</script>
</head>
<body>
<span id="resultDiv"></span>
Please enter two numbers,select an operation, and click the equals button:
<br><br>
<input type="text" id="numA" size="4">
<select id="op">
<option value="add">+</option>
<option value="subtract">-</option>
<option value="multiply">*</option>
<option value="divide">/</option>
</select>
<input type="text" id="numB" size="4">
<input type="button" value="=" onclick="doMath();">
</body>
</html>
?
??????? 以上工作都OK啦?好,啟動服務器,打開網頁: http://localhost:8080/dwr ,測試結果如下:?
?????????
?
??????? ?參考書目:
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
