From 40991fbc2806cf5f5246c313e687c6c424fca43e Mon Sep 17 00:00:00 2001 From: Louis Lam Date: Tue, 22 Mar 2022 23:46:13 +0800 Subject: [PATCH] Show reverse proxy guide along with websocket error --- src/layouts/Layout.vue | 5 +++++ src/mixins/socket.js | 3 +++ 2 files changed, 8 insertions(+) diff --git a/src/layouts/Layout.vue b/src/layouts/Layout.vue index 07982707..09c8b7db 100644 --- a/src/layouts/Layout.vue +++ b/src/layouts/Layout.vue @@ -3,6 +3,9 @@
{{ $root.connectionErrorMsg }} +
+ Using a Reverse Proxy? Check how to config it for WebSocket +
@@ -184,6 +187,8 @@ main { padding: 5px; background-color: crimson; color: white; + position: fixed; + width: 100%; } .dark { diff --git a/src/mixins/socket.js b/src/mixins/socket.js index 902bde31..7d1bbea5 100644 --- a/src/mixins/socket.js +++ b/src/mixins/socket.js @@ -41,6 +41,7 @@ export default { statusPageListLoaded: false, statusPageList: [], connectionErrorMsg: "Cannot connect to the socket server. Reconnecting...", + showReverseProxyGuide: true, }; }, @@ -185,6 +186,7 @@ export default { socket.on("connect_error", (err) => { console.error(`Failed to connect to the backend. Socket.io connect_error: ${err.message}`); this.connectionErrorMsg = `Cannot connect to the socket server. [${err}] Reconnecting...`; + this.showReverseProxyGuide = true; this.socket.connected = false; this.socket.firstConnect = false; }); @@ -199,6 +201,7 @@ export default { console.log("Connected to the socket server"); this.socket.connectCount++; this.socket.connected = true; + this.showReverseProxyGuide = false; // Reset Heartbeat list if it is re-connect if (this.socket.connectCount >= 2) {