!272 调整ws连接时机

Merge pull request !272 from 德仔/develop

stdiet-ui/src/layout/components/Navbar.vue

@@ -28,8 +28,8 @@
         trigger="click"
       >
         <div class="avatar-wrapper">
-          <img :src="avatar" class="user-avatar" />
-          <i class="el-icon-caret-bottom" />
+          <img :src="avatar" class="user-avatar" alt="avatar" />
+          <em class="el-icon-caret-bottom" />
         </div>
         <el-dropdown-menu slot="dropdown">
           <router-link to="/user/profile">
@@ -51,7 +51,7 @@
 import { mapGetters, mapActions } from "vuex";
 import Breadcrumb from "@/components/Breadcrumb";
 import Hamburger from "@/components/Hamburger";
-import { keys } from "@/utils/websocket";
+import { keys, websocketInit, beforeUnmount } from "@/utils/websocket";
 
 export default {
   components: {
@@ -65,12 +65,14 @@ export default {
   },
   created() {
     this.init();
+    websocketInit();
   },
   mounted() {
     window.postMessage({ type: keys.GET_UNREAD_COUNT }, window.location.origin);
     window.addEventListener("message", this.handleOnMessage);
   },
   unmounted() {
+    beforeUnmount();
     window.removeEventListener("message", this.handleOnMessage);
   },
   computed: {

stdiet-ui/src/main.js

@@ -21,14 +21,10 @@ import VueScrollTo from "vue-scrollto";
 import VueResource from "vue-resource";
 import HighchartsVue from "highcharts-vue";
 import Highcharts from "highcharts";
-import { init } from "@/utils/websocket";
 //图片导出模块
 import exportingInit from "highcharts/modules/exporting";
 exportingInit(Highcharts);
 
-// websocket 初始化
-init();
-
 import {
   addDateRange,
   download,

stdiet-ui/src/utils/websocket.js

@@ -41,21 +41,31 @@ function connect() {
       // console.log({ event });
       ws = undefined;
       window.removeEventListener("message", handleOnMessageReceive);
+
+      websocketInit();
     };
 
     ws.onclose = event => {
+      // console.log(event);
       ws = undefined;
       window.removeEventListener("message", handleOnMessageReceive);
+      if (event.reason !== "unmount") {
+        websocketInit();
+      }
     };
   } catch (error) {
     // console.log(error);
+    // console.log("浏览器不支持websocket");
     ws = undefined;
-    init();
-    console.log("浏览器不支持websocket");
+    websocketInit();
   }
 }
 
-export function init() {
+export function beforeUnmount(code) {
+  ws && ws.close(code, "unmount");
+}
+
+export function websocketInit() {
   !ws && connect();
 
   !ws &&