From 1995e710dcf70e635c4edaa8173f8b66cd67d499 Mon Sep 17 00:00:00 2001 From: 黄何裕 <1053952480@qq.com> Date: 星期二, 30 七月 2024 14:05:06 +0800 Subject: [PATCH] 样式优化 --- src/views/index.vue | 56 +++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 55 insertions(+), 1 deletions(-) diff --git a/src/views/index.vue b/src/views/index.vue index d64cd44..324df60 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -1,6 +1,6 @@ <template> <div class="app-container home"> - <data-view></data-view> + <!-- <data-view></data-view> --> <data-wrapper></data-wrapper> </div> </template> @@ -8,6 +8,7 @@ <script> import DataView from './home/data-view/index.vue'; import DataWrapper from './home/data-wrapper/index.vue'; +import { getToken } from '@/utils/auth' export default { name: "Index", @@ -20,6 +21,59 @@ }; }, + methods: { + senMsg(msg) { + // 鍙戦�佹枃鏈秷鎭� + this.$websocket.send(msg); + }, + // 鍙戦�佸績璺虫秷鎭� + sendHeartbeat() { + if (this.$websocket.readyState === WebSocket.OPEN) { + // 鍙戦�佸績璺虫秷鎭紝鍙互鏄换鎰忔牸寮忕殑瀛楃涓诧紝鐢ㄤ簬琛ㄧず蹇冭烦 + this.senMsg('ping'); + } + }, + // 寮�濮嬪績璺冲畾鏃跺櫒 + startHeartbeat() { + this.heartbeatInterval = setInterval(() => { + this.sendHeartbeat(); + }, 10000); // 姣� 10 绉掑彂閫佷竴娆″績璺� + }, + // 鍋滄蹇冭烦瀹氭椂鍣� + stopHeartbeat() { + clearInterval(this.heartbeatInterval); + }, + initWebsocket() { + this.$websocket = new WebSocket(process.env.VUE_APP_WEB_SOCKET_URL) + // 鐩戝惉 WebSocket 杩炴帴鎴愬姛浜嬩欢 + this.$websocket.onopen = event => { + console.log('WebSocket 杩炴帴鎴愬姛', event); + let msg = { + "token": getToken() + } + // 鍙戦�佽韩浠借璇� + this.senMsg(JSON.stringify(msg)) + // 璁剧疆蹇冭烦瀹氭椂鍣紝瀹氭湡鍙戦�佸績璺虫秷鎭� + this.startHeartbeat(); + }; + + // 鐩戝惉 WebSocket 鎺ユ敹娑堟伅浜嬩欢 + this.$websocket.onmessage = event => { + const message = event.data; + console.log('鎺ユ敹鍒版秷鎭�:', message); + }; + + // 鐩戝惉 WebSocket 杩炴帴鍏抽棴浜嬩欢 + this.$websocket.onclose = event => { + console.log('WebSocket 杩炴帴鍏抽棴', event); + // 娓呴櫎蹇冭烦瀹氭椂鍣� + this.stopHeartbeat(); + }; + }, + }, + mounted() { + this.initWebsocket(); + } }; </script> -- Gitblit v1.8.0