From 496ff7630be84489c909611ca656a6d820e64fad Mon Sep 17 00:00:00 2001 From: josedario87 Date: Mon, 13 Oct 2025 02:37:34 -0600 Subject: [PATCH] Add offline fallback page for PWA - Create offline.html with user-friendly offline message - Auto-redirect when connection is restored - Use offline.html as navigateFallback instead of root - Include offline.html in PWA assets for precaching This ensures users see a proper offline page when opening the app without connection, instead of a browser error. --- nuxt4/nuxt.config.ts | 4 +- nuxt4/public/offline.html | 126 ++++++++++++++++++++++++++++++++++++++ 2 files changed, 128 insertions(+), 2 deletions(-) create mode 100644 nuxt4/public/offline.html diff --git a/nuxt4/nuxt.config.ts b/nuxt4/nuxt.config.ts index 57c730a..a35fc79 100644 --- a/nuxt4/nuxt.config.ts +++ b/nuxt4/nuxt.config.ts @@ -22,7 +22,7 @@ export default defineNuxtConfig({ pwa: { registerType: 'autoUpdate', - includeAssets: ['favicon.ico', 'apple-touch-icon.png', 'icon.svg'], + includeAssets: ['favicon.ico', 'apple-touch-icon.png', 'icon.svg', 'offline.html'], manifest: { name: 'Plantilla Nuxt + Authentik', short_name: 'NuxtAuth', @@ -72,7 +72,7 @@ export default defineNuxtConfig({ ] }, workbox: { - navigateFallback: '/', + navigateFallback: '/offline.html', navigateFallbackDenylist: [/^\/api\//, /^\/authentik\//], globPatterns: ['**/*.{js,css,html,png,svg,ico,json}'], cleanupOutdatedCaches: true, diff --git a/nuxt4/public/offline.html b/nuxt4/public/offline.html new file mode 100644 index 0000000..efac858 --- /dev/null +++ b/nuxt4/public/offline.html @@ -0,0 +1,126 @@ + + + + + + Modo Offline - Plantilla Nuxt + Authentik + + + +
+
馃摗
+

Modo Offline

+

+ No tienes conexi贸n a internet en este momento. Esta aplicaci贸n requiere conexi贸n para autenticarse con Authentik. +

+

+ Por favor, verifica tu conexi贸n e intenta nuevamente. +

+ +
+ 鈿狅笍 Sin conexi贸n +
+
+ + + +