feat: Refactored WebSocket URL construction into a separate constructWebSoc… (#225)

Refactored WebSocket URL construction into a separate constructWebSocketURL method and updated login/logout API paths to use relative URLs instead of absolute paths.

src/views/components/AppLogin.js

@@ -26,7 +26,7 @@ export default {
         },
         async submitApi() {
             try {
-                let response = await window.http.get(`/app/login`)
+                let response = await window.http.get(`app/login`)
                 let results = response.data.results;
                 this.login_link = results.qr_link;
                 this.login_duration_sec = results.qr_duration;

src/views/components/AppLogout.js

@@ -15,7 +15,7 @@ export default {
 
         async submitApi() {
             try {
-                await http.get(`/app/logout`)
+                await http.get(`app/logout`)
             } catch (error) {
                 if (error.response) {
                     throw Error(error.response.data.message)

src/views/index.html

@@ -180,6 +180,17 @@
         });
     }
 
+    const constructWebSocketURL = () => {
+        const protocol = location.protocol === 'https:' ? 'wss://' : 'ws://';
+        const path = location.pathname
+            // Remove trailing slash
+            .replace(/\/+$/, '')
+            // Remove double slashes
+            .replace(/\/+/g, '/');
+        
+        return `${protocol}${location.host}${path}/ws`;
+    };
+
     Vue.createApp({
         components: {
             AppLogin, AppLoginWithCode, AppLogout, AppReconnect,
@@ -203,8 +214,7 @@
         },
         mounted() {
             if (window["WebSocket"]) {
-                let wsType = location.protocol !== 'https:' ? 'ws://' : 'wss://';
-                this.app_ws = new WebSocket(wsType + document.location.host + "/ws");
+                this.app_ws = new WebSocket(constructWebSocketURL());
 
                 this.app_ws.onopen = (evt) => {
                     this.app_ws.send(JSON.stringify({
@@ -213,6 +223,11 @@
                     }))
                 };
 
+                this.app_ws.onerror = (error) => {
+                     console.error('WebSocket error:', error);
+                     showErrorInfo('Connection error occurred. Please refresh the page.');
+                 };
+
                 this.app_ws.onmessage = (evt) => {
                     const message = JSON.parse(evt.data)
                     switch (message.code) {