這里使用基于HTTP長鏈接推送技術 --Comet
實現方式
- 基于 AJAX 的長輪詢（long-polling）
利用Ajax與服務器建立Http長連接查詢是否有數據更新，服務器收到一個連接如果沒有數據更新就阻塞(掛起)這個連接不要返回給客戶端，直到有新數據或服務端設置超時后再返回給客戶端。
Web客戶端發起的連接一旦被返回，或者超時就再次發起Ajax請求建立Http長連接。
HTML tag
<script src="js/jquery-3.0.0.min.js"></script>
<script src="js/McSync.js"></script>
組件依賴jQuery1.5.0版本以上，使用到了Deferred對象，以實現異步處理耗時操作(ajax請求)。
初始化組件
var mcSync = new McSync({
url: "data/sync.json",
data: '',
method: 'GET',
callback: function(data) {
console.log("do callback 1 sync: " + data.msg);
}
});
組件的構造函數需要傳入一個options對象，包括獲取消息的url、向服務端發送的數據data、http請求方法method以及請求成功返回后的回調函數callback。
啟動和停止長輪詢
mcSync.start();
mcSync.stop();
start()方法執行后，向設置的url發起ajax請求，并在請求成功返回后執行設置的callback方法，然后繼續向url發起請求。
stop()方法可以將正在進行的長輪詢停止。
核心函數
function syncMsg(options) {
return jQuery.Deferred(function(defer) {
jQuery.ajax(options).then(defer.resolve, defer.reject);
}).promise();
}
function doSync(options,callback,self) {
syncMsg(options).then(function(data) {
callback.call(this,data);
}, function(e) {
console.log(e);
}).always(function(){
if(self.isStop) return;
doSync(options,callback,self);
})
}
