Merge pull request #1462 from cgjgh/Reload-Fix

Ensure app reloads without using cache
FlowFuse · Dec 2, 2024 · e3b2791 · e3b2791
2 parents c095fdc + 0f4810d
commit e3b2791
Showing 1 changed file with 29 additions and 21 deletions.
diff --git a/ui/src/main.mjs b/ui/src/main.mjs
@@ -275,31 +275,39 @@ fetch('_setup')
             location.reload()
         }
 
+        // loads minimal VueJS app to display error message and options to user
+        function loadFallback (error) {
+            // pass the error to the Vuex store
+            store.commit('setup/setError', error)
+            const app = Vue.createApp(App)
+                .use(store)
+                .use(vuetify)
+                .use(router)
+
+            const head = createHead()
+            app.use(head)
+            app.mixin(VueHeadMixin)
+
+            // mount the VueJS app into <div id="app"></div> in /ui/public/index.html
+            app.mount('#app')
+        }
+
         let error = {}
         if (navigator.onLine) {
-            error = { error: err, type: 'server unreachable', message: 'There was an error loading the Dashboard.' }
-            // Add timer to reload the page every 20 seconds
-            setInterval(() => {
-                location.reload()
-            }, 20000)
+            if (err instanceof TypeError && err.message === 'Failed to fetch') {
+                forcePageReload(err)
+            } else {
+                error = { error: err, type: 'server unreachable', message: 'There was an error loading the Dashboard.' }
+                loadFallback(error)
+                // Add timer to reload the page every 20 seconds
+                setInterval(() => {
+                    location.reload()
+                }, 20000)
+            }
         } else {
-            error = { error: err, type: 'no internet', message: 'Your device appears to be offline.' }
             // Add event listener
             window.addEventListener('online', handleOnline)
+            error = { error: err, type: 'no internet', message: 'Your device appears to be offline.' }
+            loadFallback(error)
         }
-
-        store.commit('setup/setError', error) // pass the error to the Vuex store
-
-        // load minimal VueJS app to display error message and options to user
-        const app = Vue.createApp(App)
-            .use(store)
-            .use(vuetify)
-            .use(router)
-
-        const head = createHead()
-        app.use(head)
-        app.mixin(VueHeadMixin)
-
-        // mount the VueJS app into <div id="app"></div> in /ui/public/index.html
-        app.mount('#app')
     })