socket依赖调整
This commit is contained in:
fan
parent
cc3003dbb0
commit
f5e1c370cc
@ -18,6 +18,7 @@
|
||||
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
|
||||
},
|
||||
"dependencies": {
|
||||
"@stomp/stompjs": "^5.4.4",
|
||||
"axios": "^0.18.0",
|
||||
"dayjs": "^1.11.5",
|
||||
"echarts": "^4.7.0",
|
||||
@ -46,6 +47,7 @@
|
||||
"vuedraggable": "^2.24.3",
|
||||
"vuex": "^3.1.0",
|
||||
"wangeditor": "^4.6.17",
|
||||
"ws": "^8.13.0",
|
||||
"xlsx": "^0.14.2",
|
||||
"zrender": "^4.0.4"
|
||||
},
|
||||
|
||||
@ -155,7 +155,7 @@ class Painter {
|
||||
trainDevice.instance && this.mapInstanceLevel[deviceType.Train].remove(trainDevice.instance);
|
||||
trainDevice.instance = null;
|
||||
trainDevice.zrOptions = this.$jmap.$options;
|
||||
curModel.sectionModel.instance && this.add(trainDevice);
|
||||
curModel.sectionModel && curModel.sectionModel.instance && this.add(trainDevice);
|
||||
});
|
||||
|
||||
if (this.screenFlag) {
|
||||
|
||||
@ -1,13 +1,9 @@
|
||||
import { getToken } from '@/utils/auth';
|
||||
import { checkLoginLine } from '@/api/login';
|
||||
import { MessageBox } from 'element-ui';
|
||||
import store from '@/store/index';
|
||||
import Stomp from 'stompjs';
|
||||
import {removeToken} from './auth';
|
||||
import { Client } from '@stomp/stompjs';
|
||||
|
||||
const isDev = process.env.NODE_ENV === 'development';
|
||||
const isTest = process.env.NODE_ENV === 'test';
|
||||
const reconnectInterval = [1000, 3000, 5000, 10000, 30000, 60000];
|
||||
|
||||
var StompClient = function (headers) {
|
||||
const websocketUrl = `${store.state.user.baseUrl}/joylink-websocket?token=`;
|
||||
@ -18,7 +14,6 @@ var StompClient = function (headers) {
|
||||
};
|
||||
|
||||
StompClient.prototype = {
|
||||
websocket: null,
|
||||
clientIns: null,
|
||||
url: '',
|
||||
status: false,
|
||||
@ -26,78 +21,53 @@ StompClient.prototype = {
|
||||
headers: {
|
||||
// 'X-Token': getToken()
|
||||
},
|
||||
isPassived:true, // 是否被动断线重连
|
||||
count: 0,
|
||||
topic: '',
|
||||
onmessage: null,
|
||||
|
||||
// 连接服务端
|
||||
connect() {
|
||||
// 向服务器发起websocket连接并发送CONNECT帧
|
||||
this.websocket = new WebSocket(this.url.replace(/https/, 'wss').replace(/http/, 'ws'));
|
||||
// 获取 STOMP 子协议的客户端对象
|
||||
this.clientIns = Stomp.over(this.websocket);
|
||||
this.closeStompDebug();
|
||||
const that = this;
|
||||
this.clientIns.connect({ 'X-Token': getToken() }, () => {
|
||||
console.info('连接成功.');
|
||||
that.count = 0;
|
||||
that.status = true;
|
||||
// 恢复订阅
|
||||
that.subscribeMap.forEach((subscribe) => {
|
||||
that.subscribe(subscribe.dest, subscribe.handler, subscribe.headers);
|
||||
this.clientIns = new Client({
|
||||
brokerURL: this.url.replace(/https/, 'wss').replace(/http/, 'ws'),
|
||||
connectHeaders: {
|
||||
Authorization: getToken()
|
||||
},
|
||||
reconnectDelay: 3000,
|
||||
heartbeatIncoming: 30000,
|
||||
heartbeatOutgoing: 30000,
|
||||
onConnect: () => {
|
||||
this.subscribeMap.forEach(subscribe => {
|
||||
this.clientIns.subscribe(subscribe.dest, subscribe.handler, subscribe.headers);
|
||||
});
|
||||
}, (e)=> {
|
||||
console.log('socket连接错误:' + e);
|
||||
this.status = true;
|
||||
},
|
||||
onStompError: (frame) => {
|
||||
console.error('Stomp收到error消息,可能是认证失败,关闭Stomp客户端', frame);
|
||||
this.clientIns.deactivate();
|
||||
this.status = false;
|
||||
});
|
||||
// sock断开回调
|
||||
that.clientIns.ws.onclose = () => {
|
||||
that.status = false;
|
||||
console.info(`通信连接已断开！`);
|
||||
checkLoginLine().then((resp) => {
|
||||
if (resp.code !== 40004 && resp.code !== 40005) {
|
||||
that.count++;
|
||||
that.reconnect(that.count);
|
||||
}
|
||||
}).catch(() => {
|
||||
that.count++;
|
||||
that.reconnect(that.count);
|
||||
});
|
||||
};
|
||||
},
|
||||
logOut(err) {
|
||||
console.info(err);
|
||||
// 退出登陆前断开连接
|
||||
store.dispatch('disconnect').then(()=>{
|
||||
MessageBox.confirm('你已被登出，请重新登录', '确定登出', {
|
||||
confirmButtonText: '重新登录',
|
||||
showCancelButton: false,
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
removeToken();
|
||||
store.dispatch('FedLogOut').then(() => {
|
||||
location.reload();// 为了重新实例化vue-router对象 避免bug
|
||||
});
|
||||
});
|
||||
onDisconnect: () => {
|
||||
console.info('断开链接');
|
||||
this.subscribeMap.forEach(subscribe => {
|
||||
if (subscribe.sub && this.status) {
|
||||
subscribe.sub.unsubscribe();
|
||||
}
|
||||
});
|
||||
this.subscribeMap = new Map();
|
||||
this.status = false;
|
||||
},
|
||||
// 恢复链接
|
||||
reconnect(count) {
|
||||
console.info(`尝试第${count || 1}次连接.`);
|
||||
// Message.warning(`正在尝试第${count || 1}次通讯连接。`);
|
||||
const that = this;
|
||||
if (this.clientIns) { // 初始化stomp和websocket
|
||||
if (this.clientIns.connected) {
|
||||
this.clientIns.disconnect();
|
||||
onWebSocketError: () => {
|
||||
this.subscribeMap.forEach(subscribe => {
|
||||
subscribe.sub.unsubscribe();
|
||||
});
|
||||
this.status = false;
|
||||
}
|
||||
this.websocket.close();
|
||||
this.websocket = null;
|
||||
this.clientIns = null;
|
||||
}
|
||||
setTimeout(() => {
|
||||
that.connect();
|
||||
}, reconnectInterval[that.count] || reconnectInterval[reconnectInterval.length - 1] );
|
||||
});
|
||||
// setTimeout(() => {
|
||||
// this.clientIns.deactivate();
|
||||
// }, 10000);
|
||||
this.closeStompDebug();
|
||||
this.clientIns.activate();
|
||||
},
|
||||
|
||||
closeStompDebug() {
|
||||
@ -112,13 +82,15 @@ StompClient.prototype = {
|
||||
|
||||
// 订阅指定的topic
|
||||
subscribe(topic, onmessage, headers) {
|
||||
console.log(topic, onmessage, headers);
|
||||
this.topic = topic;
|
||||
this.onmessage = onmessage;
|
||||
this.headers = headers;
|
||||
if (!this.status) {
|
||||
this.subscribeMap.set(topic, {dest: topic, handler: onmessage, sub: null, headers, count: 1});
|
||||
} else {
|
||||
const sub = this.clientIns.subscribe(topic, onmessage);
|
||||
const sub = this.clientIns.subscribe(topic, onmessage, headers);
|
||||
console.info('订阅成功：', sub);
|
||||
this.subscribeMap.set(topic, {dest: topic, handler: onmessage, sub: sub, headers, count: 1});
|
||||
}
|
||||
},
|
||||
@ -149,18 +121,15 @@ StompClient.prototype = {
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
this.send(url, msg);
|
||||
}, 300);
|
||||
}, 3000);
|
||||
}
|
||||
},
|
||||
|
||||
disconnect() {
|
||||
if (this.clientIns) {
|
||||
if (this.clientIns.connected) {
|
||||
this.clientIns.disconnect();
|
||||
this.clientIns.deactivate();
|
||||
}
|
||||
this.isPassived = false;
|
||||
this.websocket.close();
|
||||
this.websocket = null;
|
||||
this.clientIns = null;
|
||||
}
|
||||
this.status = false;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user