問題描述

uniapp vue2 APP端push.uniapp.js經(jīng)常會有斷線的情況，看了下push.uniapp.js里面的源碼是有心跳機(jī)制，也有斷線重連的。但不太懂，我在APP.VUE加上的，收消息是正常的，但是會有一種情況，把APP彈到后臺后，我大概5分鐘以上，再重新彈起來原來的APP頁面，這個時候websocket就會斷掉，接收不到消息，我試著用在app.vue 里面的onShow寫檢測，

if (this.$connection.state === 'disconnected') {
                // 顯示加載中
                this.$tip.loading = true;
                // 重連
                this.$connection.connect();
                setTimeout(() => {
                      if (this.$connection.state === 'connected') {
                        // 連接成功，關(guān)閉加載提示框
                        this.$tip.loading = false;
                      }
                }, 3000);  // 延遲 5 秒后檢查連接狀態(tài)
              }

我是這樣寫的，寫的彈回的時候，檢測連接是否關(guān)閉，關(guān)閉就重新連接。但是沒有效果？
看到源碼底下又有一個類似的連接，不大清楚究竟是哪個？JS比較菜，望大佬指點(diǎn)下

function Connection(options) {
    this.dispatcher = new Dispatcher();
    __extends(this, this.dispatcher);
    var properies = ['on', 'off', 'emit'];
    for (var i in properies) {
        this[properies[i]] = this.dispatcher[properies[i]];
    }
    this.options = options;
    this.state = 'initialized'; //initialized connecting connected disconnected
    this.doNotConnect = 0;
    this.reconnectInterval = 1;
    this.connection = null;
    this.reconnectTimer = 0;
    this.connect();
}

Connection.prototype.updateNetworkState = function(state){
    var old_state = this.state;
    this.state = state;
    if (old_state !== state) {
        this.emit('state_change', { previous: old_state, current: state });
    }
};

Connection.prototype.connect = function () {
    this.doNotConnect = 0;
    if (this.networkState == 'connecting' || this.networkState == 'established') {
        console.log('networkState is ' + this.networkState + ' and do not need connect');
        return;
    }
    if (this.reconnectTimer) {
        clearTimeout(this.reconnectTimer);
        this.reconnectTimer = 0;
    }

    this.closeAndClean();

    var options = this.options;
    var _this = this;
    _this.updateNetworkState('connecting');
    var cb = function(){
        uni.onSocketOpen(function (res) {
            _this.reconnectInterval = 1;
            if (_this.doNotConnect) {
                _this.updateNetworkState('closing');
                uni.closeSocket();
                return;
            }
            _this.updateNetworkState('established');
            if (options.onOpen) {
                options.onOpen(res);
            }
        });

        if (options.onMessage) {
            uni.onSocketMessage(options.onMessage);
        }

        uni.onSocketClose(function (res) {
            _this.updateNetworkState('disconnected');
            if (!_this.doNotConnect) {
                _this.waitReconnect();
            }
            if (options.onClose) {
                options.onClose(res);
            }
        });

        uni.onSocketError(function (res) {
            _this.close();
            if (!_this.doNotConnect) {
                _this.waitReconnect();
            }
            if (options.onError) {
                options.onError(res);
            }
        });
    };
    uni.connectSocket({
        url: options.url,
        fail: function (res) {
            console.log('uni.connectSocket fail');
            console.log(res);
            _this.updateNetworkState('disconnected');
            _this.waitReconnect();
        },
        success: function() {

        }
    });
    cb();
}

Connection.prototype.connect = function () {
    this.doNotConnect = 0;
    if (this.state === 'connected') {
        console.log('networkState is "' + this.state + '" and do not need connect');
        return;
    }
    if (this.reconnectTimer) {
        clearTimeout(this.reconnectTimer);
        this.reconnectTimer = 0;
    }

    this.closeAndClean();

    var options = this.options;

    this.updateNetworkState('connecting');

    var _this = this;
    var cb = function(){
        uni.onSocketOpen(function (res) {
            _this.reconnectInterval = 1;
            if (_this.doNotConnect) {
                _this.updateNetworkState('disconnected');
                uni.closeSocket();
                return;
            }
            if (options.onOpen) {
                options.onOpen(res);
            }
        });

        if (options.onMessage) {
            uni.onSocketMessage(options.onMessage);
        }

        uni.onSocketClose(function (res) {
            _this.updateNetworkState('disconnected');
            if (!_this.doNotConnect) {
                _this.waitReconnect();
            }
            if (options.onClose) {
                options.onClose(res);
            }
        });

        uni.onSocketError(function (res) {
            _this.close();
            if (!_this.doNotConnect) {
                _this.waitReconnect();
            }
            if (options.onError) {
                options.onError(res);
            }
        });
    };
    uni.connectSocket({
        url: options.url+'/app/'+options.app_key,
        fail: function (res) {
            console.log('uni.connectSocket fail');
            console.log(res);
            _this.updateNetworkState('disconnected');
            _this.waitReconnect();
        },
        success: function() {

        }
    });
    cb();
}