From 6acc6874e61f4e995d33d3031694b3168a0ccf31 Mon Sep 17 00:00:00 2001
From: zjj <3272660260@qq.com>
Date: 星期四, 21 十一月 2024 09:11:38 +0800
Subject: [PATCH] #
---
Monitor-APP/static/js/WebSocketClient02.js | 141 +++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 141 insertions(+), 0 deletions(-)
diff --git a/Monitor-APP/static/js/WebSocketClient02.js b/Monitor-APP/static/js/WebSocketClient02.js
new file mode 100644
index 0000000..7ea8584
--- /dev/null
+++ b/Monitor-APP/static/js/WebSocketClient02.js
@@ -0,0 +1,141 @@
+// import { EventDispatcher } from './dispatcher';
+
+export class WebSocketClient extends EventDispatcher {
+ // #socket閾炬帴
+ url = '';
+ // #socket瀹炰緥
+ socket = null;
+ // #閲嶈繛娆℃暟
+ reconnectAttempts = 0;
+ // #鏈�澶ч噸杩炴暟
+ maxReconnectAttempts = 5;
+ // #閲嶈繛闂撮殧
+ reconnectInterval = 10000; // 10 seconds
+ // #鍙戦�佸績璺虫暟鎹棿闅�
+ heartbeatInterval = 1000 * 30;
+ // #璁℃椂鍣╥d
+ heartbeatTimer = undefined;
+ // #褰诲簳缁堟ws
+ stopWs = false;
+ // *鏋勯�犲嚱鏁�
+ constructor(url) {
+ super();
+ this.url = url;
+ }
+ // >鐢熷懡鍛ㄦ湡閽╁瓙
+ onopen(callBack) {
+ this.addEventListener('open', callBack);
+ }
+ onmessage(callBack) {
+ this.addEventListener('message', callBack);
+ }
+ onclose(callBack) {
+ this.addEventListener('close', callBack);
+ }
+ onerror(callBack) {
+ this.addEventListener('error', callBack);
+ }
+ // >娑堟伅鍙戦��
+ send(message) {
+ if (this.socket && this.socket.readyState === WebSocket.OPEN) {
+ this.socket.send(message);
+ } else {
+ console.error('[WebSocket] 鏈繛鎺�');
+ }
+ }
+
+ // !鍒濆鍖栬繛鎺�
+ connect() {
+ if (this.reconnectAttempts === 0) {
+ this.log('WebSocket', `鍒濆鍖栬繛鎺ヤ腑... ${this.url}`);
+ }
+ if (this.socket && this.socket.readyState === WebSocket.OPEN) {
+ return;
+ }
+ this.socket = new WebSocket(this.url);
+
+ // !websocket杩炴帴鎴愬姛
+ this.socket.onopen = event => {
+ this.stopWs = false;
+ // 閲嶇疆閲嶈繛灏濊瘯鎴愬姛杩炴帴
+ this.reconnectAttempts = 0;
+ // 鍦ㄨ繛鎺ユ垚鍔熸椂鍋滄褰撳墠鐨勫績璺虫娴嬪苟閲嶆柊鍚姩
+ this.startHeartbeat();
+ this.log('WebSocket', `杩炴帴鎴愬姛,绛夊緟鏈嶅姟绔暟鎹帹閫乕onopen]... ${this.url}`);
+ this.dispatchEvent('open', event);
+ };
+
+ this.socket.onmessage = event => {
+ this.dispatchEvent('message', event);
+ this.startHeartbeat();
+ };
+
+ this.socket.onclose = event => {
+ if (this.reconnectAttempts === 0) {
+ this.log('WebSocket', `杩炴帴鏂紑[onclose]... ${this.url}`);
+ }
+ if (!this.stopWs) {
+ this.handleReconnect();
+ }
+ this.dispatchEvent('close', event);
+ };
+
+ this.socket.onerror = event => {
+ if (this.reconnectAttempts === 0) {
+ this.log('WebSocket', `杩炴帴寮傚父[onerror]... ${this.url}`);
+ }
+ this.closeHeartbeat();
+ this.dispatchEvent('error', event);
+ };
+ }
+
+ // > 鏂綉閲嶈繛閫昏緫
+ handleReconnect() {
+ if (this.reconnectAttempts < this.maxReconnectAttempts) {
+ this.reconnectAttempts++;
+ this.log('WebSocket', `灏濊瘯閲嶈繛... (${this.reconnectAttempts}/${this.maxReconnectAttempts}) ${this.url}`);
+ setTimeout(() => {
+ this.connect();
+ }, this.reconnectInterval);
+ } else {
+ this.closeHeartbeat();
+ this.log('WebSocket', `鏈�澶ч噸杩炲け璐ワ紝缁堟閲嶈繛: ${this.url}`);
+ }
+ }
+
+ // >鍏抽棴杩炴帴
+ close() {
+ if (this.socket) {
+ this.stopWs = true;
+ this.socket.close();
+ this.socket = null;
+ this.removeEventListener('open');
+ this.removeEventListener('message');
+ this.removeEventListener('close');
+ this.removeEventListener('error');
+ }
+ this.closeHeartbeat();
+ }
+
+ // >寮�濮嬪績璺虫娴� -> 瀹氭椂鍙戦�佸績璺虫秷鎭�
+ startHeartbeat() {
+ if (this.stopWs) return;
+ if (this.heartbeatTimer) {
+ this.closeHeartbeat();
+ }
+ this.heartbeatTimer = setInterval(() => {
+ if (this.socket) {
+ this.socket.send(JSON.stringify({ type: 'heartBeat', data: {} }));
+ this.log('WebSocket', '閫佸績璺虫暟鎹�...');
+ } else {
+ console.error('[WebSocket] 鏈繛鎺�');
+ }
+ }, this.heartbeatInterval);
+ }
+
+ // >鍏抽棴蹇冭烦
+ closeHeartbeat() {
+ clearInterval(this.heartbeatTimer);
+ this.heartbeatTimer = undefined;
+ }
+}
\ No newline at end of file
--
Gitblit v1.9.1