Blame view

ant-design-vue-jeecg/src/mixins/WebsocketMixin.js 2.17 KB
1
import store from '@/store/'
2
3
4
import { ACCESS_TOKEN } from '@/store/mutation-types'
import Vue from 'vue'
5
6
7
8
9
10
11
12
13
14
export const WebsocketMixin = {
  mounted() {
    this.initWebSocket();
  },
  destroyed: function () {
    // 离开页面生命周期函数
    this.websocketOnclose();
  },
  methods:{
    initWebSocket: function () {
15
      let token = Vue.ls.get(ACCESS_TOKEN)
16
17
18
19
20
21
22
23
24
      console.log("------------WebSocket连接成功");
      // WebSocket与普通的请求所用协议有所不同,ws等同于http,wss等同于https
      var userId = store.getters.userInfo.id;
      if(!this.socketUrl.startsWith('/')){
        this.socketUrl = '/' + this.socketUrl
      }
      if(!this.socketUrl.endsWith('/')){
        this.socketUrl = this.socketUrl + '/'
      }
25
      var url = window._CONFIG['domianURL'].replace("https://","wss://").replace("http://","ws://") + this.socketUrl + userId + "/" + token;
26
27
28
      //update-begin-author:taoyan date:2022-4-22 for:  v2.4.6 的 websocket 服务端,存在性能和安全问题。 #3278
      this.websock = new WebSocket(url, [token]);
      //update-end-author:taoyan date:2022-4-22 for:  v2.4.6 的 websocket 服务端,存在性能和安全问题。 #3278
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
      this.websock.onopen = this.websocketOnopen;
      this.websock.onerror = this.websocketOnerror;
      this.websock.onmessage = this.websocketOnmessage;
      this.websock.onclose = this.websocketOnclose;
    },
    websocketOnopen: function () {
      console.log("WebSocket连接成功");
    },
    websocketOnerror: function (e) {
      console.log("WebSocket连接发生错误");
      this.reconnect();
    },
    websocketOnclose: function (e) {
      this.reconnect();
    },
    websocketSend(text) {
      // 数据发送
      try {
        this.websock.send(text);
      } catch (err) {
        console.log("send failed (" + err.code + ")");
      }
    },
    reconnect() {
      var that = this;
      if(that.lockReconnect) return;
      that.lockReconnect = true;
      //没连接上会一直重连,设置延迟避免请求过多
      setTimeout(function () {
        console.info("尝试重连...");
        that.initWebSocket();
        that.lockReconnect = false;
      }, 5000);
    },
  }

}