websocket 钩子

front/src/App.vue

@@ -2,7 +2,7 @@
  * @Author: hisense.wuhongjian
  * @Date: 2022-05-06 11:12:00
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-07-21 17:09:10
+ * @LastEditTime: 2022-07-26 11:27:50
  * @Description: 告诉大家这是什么
 -->
 <template>
@@ -31,19 +31,28 @@
   const locale = zhCN
   const token = Cookies.get('ucsToken')
   console.log('token=================>', token)
-  var ws = new WebSocket(
+  let ws = new WebSocket(
     `ws://${window.SITE_CONFIG['websocketURL']}/websocket?token=${token}`
   )
   // ws.send()给服务器发送信息
   // 服务器每次返回信息都会执行一次onmessage方法
   ws.onmessage = function (e) {
-    console.log('服务器返回的信息: ' + e.data)
+    console.log('WebSocket服务器返回的信息: ' + e.data)
     mybus.emit('getMynotice')
     // 判断当前路由是否是消息中心
     if (router.currentRoute.value.name === 'mynoticeView') {
       mybus.emit('noticeListInit')
     }
   }
+  ws.onerror = function (e) {
+    console.log('WebSocket连接异常============================>', e)
+    ws = new WebSocket(
+      `ws://${window.SITE_CONFIG['websocketURL']}/websocket?token=${token}`
+    )
+  }
+  ws.onclose = function (e) {
+    console.log('WebSocket连接断开============================>', e)
+  }
   onBeforeUnmount(() => {
     // 4.卸载前, 关闭链接
     ws.close()