Web即时消息通知的实现

Web即时消息通知，可以使用轮询，长轮询和SSE或Socket。比较成熟的方法是长轮询，SSE和Socket都受到客户端或服务器端的约束。

本文以长轮询为主题简介如何实现长轮询。

1. 将消息抽象为Message:Name Data 和Id,Name必须，Data和Id可选。
2. 使用im订阅服务器的消息。参数包含a|b&c，其中a|b是为历史消息提供消息版本。c为确认消息。
3. 客户端自定义消息处理，默认有message消息和error消息，分别处理成功或失败消息。

以下是客户端代码：

    $.im = function (url, options) {
        this.stop = true;
        this.url = url;
        this.options = options;
        this.ack = [];
        this.events = new Array();
        this.on = function (event, callBack) {
            this.events[event] = callBack;
        }
        this.onmessage = function (callBack) {
            this.on("message", callBack);
        }
        var query = function () {
            if (this.stop) {
                return;
            }
            var url = this.url + "?c=" + this.ack.join(",");
 
            $.ajax({
                url: url,
                type: 'get',
                dataType: "json",
                contentType: "application/json",
                success: function (data) {
                    this.query();
                    if (data.id) {
                        this.ack.push(data.id);
                    }
                    if (this.events["message"]) {
                        this.events["message"](data);
                    }
 
                },
                error: function (data) {
                    this.query();
                    if (this.events["error"]) {
                        this.events["error"](data);
                    }
                }
            });
        }
        this.start = function () {
            this.stop = false;
            query();
        }
        this.stop = function () {
            this.stop = true;
 
        }
        this.emit = function (event, data) {
            this.events[event](data);
        }
        return this;
    };
    var im = $.im("http://api.abc.com/test", {});
    im.onmessage(function (data) {
        alert(data.id);
        alert(data.data);
    })
    im.on("myevent", function (data) {
        alert(data.id);
        alert(data.data);
    });
    im.start();
    im.stop();
    im.emit("message", { id: 1, data: "message" });