1、伺服器推技術
通過用戶端發出請求擷取伺服器端資料的方式通常稱為“拉”技術，很形象說明用戶端在拉取伺服器端資料，而有時候需要伺服器端主動向用戶端“推”資料，比如監測聊天上線人數主動向上線發送訊息，後台資料庫發生變化是主動更新所有用戶端展示。
2、Reverse Ajax實現伺服器推技術
DWR2.x的推技術也叫DWR Reverse Ajax（逆向Ajax）主要是在BS架構中，從伺服器端向多個瀏覽器主動推資料的一種技術。DWR的逆向Ajax主要包括兩種模式：主動模式和被動模式。其中主動模式包括polling和comet兩種，被動模式只有piggyback這一種。
（1）piggyback方式，是預設的方式。
如果後台有什麼內容需要推送到前台，是要等到那個頁面進行下一次ajax請求的時候，將需要推送的內容附加在該次請求之後，傳回到頁面。只有等到下次請求頁面主動發起了，中間的變化內容才傳遞迴頁面。
（2）comet方式
當服務端建立和瀏覽器的串連，將頁面內容發送到瀏覽器之後，對應的串連並不關閉，只是暫時掛起。如果後面有什麼新的內容需要推送到用戶端的時候直接通過前面掛起的串連再次傳送資料。伺服器所能提供的串連數目是一定的，在大量的掛起的串連沒有關閉的情況下，可能造成新的串連請求不能接入，從而影響到服務品質。
（3）polling方式
由瀏覽器定時向服務端發送ajax請求，詢問後台是否有什麼內容需要推送，有的話就會由服務端返回推送內容。這種方式和我們直接在頁面通過定時器發送ajax請求，然後查詢後台是否有變化內容的實現是類似的。只不過用了dwr之後這部分工作由架構幫我們完成了。
3、配置web.xml使用reverse ajax
（1）piggyback方式，預設的dwr在web.xml檔案的配置即piggyback方式。
（2）comet需要增加如下配置
<init-param>
<param-name>pollAndCometEnabled</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>activeReverseAjaxEnabled</param-name>
<param-value>true</param-value>
</init-param>
（3）polling方式：在comet方式的基礎之上，再配置以下參數
<init-param>
<param-name>org.directwebremoting.extend.ServerLoadMonitor</param-nam
<param-value>org.directwebremoting.impl.PollingServerLoadMonitor</param-value>
</init-param>
<!-- 毫秒數。頁面預設的請求間隔時間是5秒 -->
<init-param>
<param-name>disconnectedTime</param-name>
<param-value>60000</param-value>
</init-param>
4、編寫聊天訊息處理類
public class MessageManager {
private static List<String> msgList = new LinkedList<String>();
public List<String> getMsgList() {
return msgList;
}
public synchronized void sendMessage(String msg) {
msgList.add(msg);
showMessage();
}
private void showMessage() {
WebContext wctx = WebContextFactory.get();
String currentPage = wctx.getCurrentPage();
ScriptBuffer script = new ScriptBuffer(); script.appendScript("receiveMessages(").appendData(msgList).appendScript(");");// 調用頁面的javascript方法把值添到頁面上。
Collection pages = wctx.getScriptSessionsByPage(currentPage);// 迴圈出所有的會話頁面並執行
for (Iterator it = pages.iterator(); it.hasNext();) {
ScriptSession otherSession = (ScriptSession) it.next();
otherSession.addScript(script);
}
}
}
5、dwr.xml中配置聊天訊息處理類
<create creator="new" javascript="messageManager" scope="application">
<param name="class" value="service.MessageManager"/>
</create>
6、頁面代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ReverseAjax.html</title>
<meta http-equiv="content-type" content="text/html;
charset=UTF-8">
<script type='text/javascript' src='/dwrtest/dwr/interface/messageManager.js'></script>
<script type='text/javascript' src='/dwrtest/dwr/engine.js'></script>
<script type='text/javascript' src='/dwrtest/dwr/util.js'></script>
<script type="text/javascript">
dwr.engine.setActiveReverseAjax(true);
function receiveMessages(msg) {
var message="";
for(var i=0;i<msg.length;i++)
message+=msg[i]+"<br>";
$("content").innerHTML=message
}
function init(){
messageManager.getMsgList(callback);
function callback(msg){
var message="";
for(var i=0;i<msg.length;i++)
message+=msg[i]+"<br>";
$("content").innerHTML=message
}
}
window.onload=init;
</script>
</head>
<body >
<input type="text" id="txt"/>
<button onclick="messageManager.sendMessage($('txt').value)">send</button>
<div id="content"></div>
</body>
</html>
7、效果
在一個瀏覽器中發送訊息，另外一個裡面自動擷取剛才的訊息並顯示。
轉載請標明出處 http://blog.csdn.net/shimiso
技術交流群:173711587
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
