解决连接关闭后xhr_streaming无限循环的问题

src/store/modules/user.js

@@ -3,7 +3,7 @@ import { login, logout, getInfo } from '@/api/login';
 import { getToken, setToken, removeToken } from '@/utils/auth';
 import { getUserConfigInfo } from '@/api/management/user';
 import { LoginParams } from '@/utils/login';
-import { creatSubscribe, clearSubscribe, perpetualTopic, commonTopic } from '@/utils/stomp';
+import { creatSubscribe, clearSubscribe, perpetualTopic, commonTopic, disconnect} from '@/utils/stomp';
 import Cookies from 'js-cookie';
 
 const user = {
@@ -65,6 +65,9 @@ const user = {
         SUBSCRIBE_UN: () => {
             clearSubscribe(perpetualTopic);
             clearSubscribe(commonTopic);
+        },
+        Disconnect: ()=>{
+            disconnect();
         }
     },
 
@@ -188,6 +191,9 @@ const user = {
         },
         subscribe_un({commit}, params) {
             commit('SUBSCRIBE_UN', params);
+        },
+        disconnect({commit}, params) {
+            commit('Disconnect', params);
         }
     }
 };

src/utils/request.js

@@ -43,6 +43,8 @@ service.interceptors.response.use(
                 EventBus.$emit('viewLoading', false);
                 // eslint-disable-next-line no-undef
                 EventBus.$emit('clearCheckLogin');
+                // 断开连接
+                store.dispatch('Disconnect');
                 MessageBox.confirm(i18n.t('tip.logoutTips'), i18n.t('tip.hint'), {
                     confirmButtonText: i18n.t('tip.confirmLogin'),
                     showCancelButton: false,

src/utils/sock.js

@@ -56,7 +56,8 @@ StompClient.prototype = {
                 }
 
                 // 建立连接对象（还未发起连接）
-                this.socket = new SockJS(websocketUrl + getToken());
+                // （null, {transports:['websocket']}）解决连接关闭后xhr_streaming无限循环
+                this.socket = new SockJS(websocketUrl + getToken(), null, {transports:['websocket', 'MozWebSocket']});
 
                 // 获取 STOMP 子协议的客户端对象
                 this.clientIns = Stomp.over(this.socket);
@@ -120,7 +121,7 @@ StompClient.prototype = {
                         this.connect();
                     }).catch((err) => {
                         if (err.code == 40003 || err.code == 40004 || err.code == 40005 || err.code == 50012) {
-                            this.logOut();
+                            this.logOut(err);
                         }
                         if (err.code == 50008 || err.code == 50014) {
                             this.url = websocketUrl + getToken();
@@ -136,6 +137,7 @@ StompClient.prototype = {
     },
     logOut(err) {
         if (err.code == 40003 || err.code == 40004 || err.code == 40005 || err.code == 50012) {
+            this.disconnect();
             MessageBox.confirm('你已被登出，请重新登录', '确定登出', {
                 confirmButtonText: '重新登录',
                 showCancelButton: false,
@@ -175,6 +177,7 @@ StompClient.prototype = {
 
     // 订阅指定的topic
     subscribe(topic, onmessage, headers) {
+        // const timeDelay = [1000, 2000, 5000, 10000];
         this.topic = topic;
         this.onmessage = onmessage;
         this.headers = headers;

src/utils/stomp.js

@@ -35,3 +35,10 @@ export function clearSubscribe(topic) {
         Vue.prototype.$stomp.unsubscribe(topic);
     }
 }
+
+// 断开连接
+export function disconnect() {
+    if (Vue.prototype.$stomp) {
+        Vue.prototype.$stomp.disconnect();
+    }
+}