From 4260da6a8b15cc3fd8dfb254ba3a078b1d7c596a Mon Sep 17 00:00:00 2001
From: hcong <1050828145@qq.com>
Date: 星期二, 26 十一月 2024 14:28:05 +0800
Subject: [PATCH] 1. socket生命周期监听、断线重连、心跳检测 2. socket消息校验、生成、解析 3. 观察者模式分发消息
---
src/App.vue | 37 +++++++++++++++++++++++++++++++------
1 files changed, 31 insertions(+), 6 deletions(-)
diff --git a/src/App.vue b/src/App.vue
index d8dfe8b..e992d9f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -19,17 +19,17 @@
<el-scrollbar>
<div class="el-main__content">
<Content></Content>
- <el-backtop
+ <!-- <el-backtop
target=".el-main .el-scrollbar__wrap"
- :right="40"
+ :right="10"
:bottom="100"
- style="width: 120px"
+ style="z-index: 1000;"
>
<div class="back-top">
<el-icon><ArrowUpBold /></el-icon>
<span style="">杩斿洖椤堕儴</span>
</div>
- </el-backtop>
+ </el-backtop> -->
</div>
</el-scrollbar>
</el-main>
@@ -40,13 +40,15 @@
<script>
import zhCn from 'element-plus/dist/locale/zh-cn.mjs';
-
+import { FYWebSocket } from '@/socket/index.js'
+import eventBus from '@/socket/eventBus.js';
export default {
data() {
return {
isCollapsed: false,
navTitles: [],
locale: zhCn,
+ socket: null,
};
},
methods: {
@@ -56,11 +58,33 @@
navPage(titles) {
this.navTitles = titles;
},
+ // 杩炴帴websocket
+ connectWebSocket() {
+ this.socket = new FYWebSocket()
+ this.socket.init({
+ time: 4 * 1000,
+ timeout: 2 * 1000,
+ reconnect: 3 * 1000
+ }, true)
+ },
+ // 鏂嚎閲嶈繛websocket
+ startReconnectWebSocket() {
+ eventBus.register('reconnect', () => {
+ this.connectWebSocket()
+ })
+ }
},
+ created() {
+ this.connectWebSocket()
+ this.startReconnectWebSocket()
+ }
};
</script>
<style scoped>
+.el-container{
+ /* min-height: 820px; */
+}
.el-aside {
width: initial;
}
@@ -79,8 +103,9 @@
}
.el-main__content {
- padding: var(--el-main-padding);
+ padding: var(--el-main-padding) calc(var(--el-main-padding) / 2);
max-height: calc(100vh - 60px - var(--el-main-padding) * 2);
+ /* background-color: aqua; */
/* overflow: auto; */
}
.back-top {
--
Gitblit v1.9.3