diff --git a/nuxt4/app/composables/useAuthentik.ts b/nuxt4/app/composables/useAuthentik.ts index 15e8753..4308af4 100644 --- a/nuxt4/app/composables/useAuthentik.ts +++ b/nuxt4/app/composables/useAuthentik.ts @@ -50,25 +50,64 @@ export const useAuthentik = () => { navigateTo(`${authentikUrl}/if/user/`, { external: true, open: { target: '_blank' } }) } - const checkSessionStatus = () => { + const checkSessionStatus = async () => { const toast = useToast() - if (isAuthenticated.value && user.value) { + // Mostrar toast de "verificando..." + toast.add({ + title: 'Verificando sesión...', + description: 'Consultando estado en Authentik', + color: 'info', + icon: 'i-heroicons-arrow-path', + timeout: 2000 + }) + + try { + // Consultar el endpoint de API que verifica contra Authentik + const response = await $fetch('/api/auth/status') + + if (response.authenticated && response.user) { + // Sesión activa en Authentik + toast.add({ + title: 'Sesión Activa', + description: `Conectado como: ${response.user.name || response.user.username}`, + color: 'success', + icon: 'i-heroicons-check-circle', + timeout: 5000 + }) + + // Actualizar el state local si está desincronizado + if (!authentikUser.value) { + authentikUser.value = { + ...response.user, + avatar: `https://ui-avatars.com/api/?name=${encodeURIComponent(response.user.name || response.user.username)}&background=random&size=128` + } + } + } else { + // Sin sesión en Authentik + toast.add({ + title: 'Sin Sesión', + description: 'No hay sesión activa en Authentik', + color: 'warning', + icon: 'i-heroicons-exclamation-triangle', + timeout: 5000 + }) + + // Limpiar state local si está desincronizado + if (authentikUser.value) { + authentikUser.value = null + } + } + } catch (error) { + // Error al consultar toast.add({ - title: 'Sesión Activa', - description: `Conectado como: ${user.value.name || user.value.username}`, - color: 'success', - icon: 'i-heroicons-check-circle', - timeout: 5000 - }) - } else { - toast.add({ - title: 'Sin Sesión', - description: 'No hay sesión activa en este momento', - color: 'warning', - icon: 'i-heroicons-exclamation-triangle', + title: 'Error', + description: 'No se pudo verificar el estado de la sesión', + color: 'error', + icon: 'i-heroicons-x-circle', timeout: 5000 }) + console.error('Error checking session status:', error) } } diff --git a/nuxt4/app/server/api/auth/status.get.ts b/nuxt4/app/server/api/auth/status.get.ts new file mode 100644 index 0000000..e156bd8 --- /dev/null +++ b/nuxt4/app/server/api/auth/status.get.ts @@ -0,0 +1,36 @@ +/** + * API endpoint para verificar el estado de autenticación en tiempo real + * Consulta los headers inyectados por Authentik Proxy Outpost + */ +export default defineEventHandler((event) => { + // Leer headers de Authentik en tiempo real + const headers = getHeaders(event) + + const username = headers['x-authentik-username'] + const email = headers['x-authentik-email'] + const name = headers['x-authentik-name'] + const groups = headers['x-authentik-groups'] + const uid = headers['x-authentik-uid'] + + // Si no hay username, no hay sesión activa en Authentik + if (!username) { + return { + authenticated: false, + user: null, + timestamp: new Date().toISOString() + } + } + + // Sesión activa + return { + authenticated: true, + user: { + username, + email, + name, + groups: groups ? groups.split('|') : [], + uid + }, + timestamp: new Date().toISOString() + } +})