vue+element WebSocket

//app.vue
<template>
  <div id="app">
      <div class="fr cursor">
        <!-- 工单提醒 start-->
        <el-badge :is-dot="showMsg" class="item">
          <i class="el-icon-bell colorW" size="20" @click="handleCommandGoWoker"></i>
        </el-badge>
        <!-- 工单提醒 end-->
      </div>
    </el-menu>

    <router-view />
  </div>
</template>
<script>
let wsTime = null
let wsSend = null
export default {
  name: "app",
  data() {
    return {
      showMsg:false,
    }
  },
  methods: {
    handleCommandGoWoker(){
    	this.showMsg = false
    },
    websocket(){
      // WebSocket start
      if ('WebSocket' in window) {
        let id = JSON.parse(localStorage.getItem('userInfo'))?JSON.parse(localStorage.getItem('userInfo')).employeeId:''
        let ws = new WebSocket('wss://suifang-xxxx.com.cn/websocket/'+id)
        ws.onopen = (event) => {
          console.log('open',event)
        };
        ws.onmessage = (event) => {
          // console.log('mesage',event)
          if(event.data != '连接成功' && event.data != '心跳'){
            this.showMsg = true
            let notify = this.$notify.info({
              title: '消息',
              message: event.data,
              duration: 0,
              onClick:()=>{
                notify.close()
                this.showMsg = false
              }
            });
          }
        };
        ws.onerror = (event) => {
          console.log('error',event)
          if(wsTime){
            window.clearTimeout(wsTime)
            wsTime = null
          }
          wsTime = window.setTimeout(() => {
            this.websocket()
          },3000)
        };
        ws.onclose = (event) => {
          console.log('close',event)
          if(wsTime){
            window.clearTimeout(wsTime)
            wsTime = null
          }
          wsTime = window.setTimeout(() => {
            this.websocket()
          },3000)
        };
        //维持心跳连接，处理60秒自动断开
        if(wsSend){
          window.clearInterval(wsSend)
          wsSend = null
        }
        wsSend = window.setInterval(()=>{
          if(ws.readyState == 1){
            ws.send('心跳') 
          }             
        },10000)
      }else{
        console.log('浏览器不支持 WebSocket..')
      }
      // WebSocket end
    }
  },
  created() {
    this.websocket()
    
    // Server-Sent Events (sse) start
    // if ('EventSource' in window) {
    //   let source = new EventSource('https://xxx.com.cn/websocket/6', { withCredentials: false })
    //   source.onconnecting = function (event) {
    //       console.log('connecting',event)
    //   };
    //   source.onopen = function (event) {
    //       console.log('open',event)
    //   };
    //   source.onmessage = function (event) {
    //       console.log('mesage',event)
    //   };
    //   source.onerror = function (event) {
    //       console.log('error',event)
    //   };
    //   // source.close()
    // }else{
    //   console.log('浏览器不支持 Server-Sent..')
    // }
    // Server-Sent Events (sse) end
  },
};
</script>