消息推送Web端组件

这里使用基于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);
    })
}