Improve PWA offline functionality and fix session caching
- Enable navigateFallback for offline navigation support - Add JSON files to glob patterns for heroicons support - Change Authentik API caching from NetworkFirst to NetworkOnly to prevent stale session data - Add offline detection in checkSessionStatus with proper user feedback - Add no-cache headers to /api/auth/status endpoint to prevent browser caching - Show "Modo Offline" toast when user tries to check session while offline
This commit is contained in:
@@ -53,6 +53,18 @@ export const useAuthentik = () => {
|
||||
const checkSessionStatus = async () => {
|
||||
const toast = useToast()
|
||||
|
||||
// Verificar si está offline primero
|
||||
if (!navigator.onLine) {
|
||||
toast.add({
|
||||
title: 'Modo Offline',
|
||||
description: 'No se puede validar sesión sin conexión',
|
||||
color: 'gray',
|
||||
icon: 'i-heroicons-wifi',
|
||||
timeout: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// Mostrar toast de "verificando..."
|
||||
toast.add({
|
||||
title: 'Verificando sesión...',
|
||||
@@ -93,6 +105,18 @@ export const useAuthentik = () => {
|
||||
})
|
||||
}
|
||||
} catch (error) {
|
||||
// Verificar si está offline ahora (pudo desconectarse durante la petición)
|
||||
if (!navigator.onLine) {
|
||||
toast.add({
|
||||
title: 'Modo Offline',
|
||||
description: 'No se puede validar sesión sin conexión',
|
||||
color: 'gray',
|
||||
icon: 'i-heroicons-wifi',
|
||||
timeout: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// Si el error es por redirect de Authentik (CORS/fetch error), significa que no hay sesión
|
||||
// Authentik redirige a login cuando no hay sesión válida, causando error CORS en fetch
|
||||
const errorMessage = error?.message || error?.toString() || ''
|
||||
|
||||
@@ -72,22 +72,15 @@ export default defineNuxtConfig({
|
||||
]
|
||||
},
|
||||
workbox: {
|
||||
navigateFallback: undefined,
|
||||
globPatterns: ['**/*.{js,css,html,png,svg,ico}'],
|
||||
navigateFallback: '/',
|
||||
globPatterns: ['**/*.{js,css,html,png,svg,ico,json}'],
|
||||
cleanupOutdatedCaches: true,
|
||||
runtimeCaching: [
|
||||
{
|
||||
urlPattern: /^https:\/\/authentik\.nucleoriofrio\.com\/.*/i,
|
||||
handler: 'NetworkFirst',
|
||||
handler: 'NetworkOnly',
|
||||
options: {
|
||||
cacheName: 'authentik-api-cache',
|
||||
expiration: {
|
||||
maxEntries: 10,
|
||||
maxAgeSeconds: 60 * 60 * 24 // 24 hours
|
||||
},
|
||||
cacheableResponse: {
|
||||
statuses: [0, 200]
|
||||
}
|
||||
networkTimeoutSeconds: 10
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
@@ -3,6 +3,13 @@
|
||||
* Consulta los headers inyectados por Authentik Proxy Outpost
|
||||
*/
|
||||
export default defineEventHandler((event) => {
|
||||
// Establecer headers para prevenir caching
|
||||
setResponseHeaders(event, {
|
||||
'Cache-Control': 'no-store, no-cache, must-revalidate, proxy-revalidate',
|
||||
'Pragma': 'no-cache',
|
||||
'Expires': '0'
|
||||
})
|
||||
|
||||
// Leer headers de Authentik en tiempo real
|
||||
const headers = getHeaders(event)
|
||||
|
||||
|
||||
Reference in New Issue
Block a user