diff --git a/src/lib/components/FireBaseButton.svelte b/src/lib/components/FireBaseButton.svelte index 91a506e..bc9ccf0 100644 --- a/src/lib/components/FireBaseButton.svelte +++ b/src/lib/components/FireBaseButton.svelte @@ -1,17 +1,205 @@ - + + + + + + + diff --git a/src/lib/head/Header.svelte b/src/lib/head/Header.svelte index b403ae7..3002bb9 100644 --- a/src/lib/head/Header.svelte +++ b/src/lib/head/Header.svelte @@ -20,7 +20,7 @@ onMount(() => { sesionStore.subscribe((value) => { - showCerrarSesion = !!value?.accessToken; + showCerrarSesion = !!value?.username; }); }); diff --git a/src/lib/hooks/loginFirebase.ts b/src/lib/hooks/loginFirebase.ts new file mode 100644 index 0000000..72a33bc --- /dev/null +++ b/src/lib/hooks/loginFirebase.ts @@ -0,0 +1,30 @@ +import { apiBase } from '@/stores/url'; +import type { LoginSsoDto, Sesion } from '../../types'; +import { sesionStore } from '@/stores/usuario'; +import { goto } from '$app/navigation'; +import { get } from 'svelte/store'; + +export async function loginFirebase(dto: LoginSsoDto, callbackfn: () => void) { + if (dto.accessToken == '' || dto.uid == '') return; + try { + const req = await fetch(get(apiBase) + '/api/auth/login/sso', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + credentials: 'include', + body: JSON.stringify(dto) + }); + if (req.ok) { + const token: Sesion = await req.json(); + console.log(token); + sesionStore.set(token); + goto('/'); + } else { + callbackfn(); + } + } catch { + // callbackfn(); + console.error('fallo al intentar alcanzar el servidor'); + } +} diff --git a/src/lib/hooks/registerFirebase.ts b/src/lib/hooks/registerFirebase.ts new file mode 100644 index 0000000..bdc939a --- /dev/null +++ b/src/lib/hooks/registerFirebase.ts @@ -0,0 +1,30 @@ +import { apiBase } from '@/stores/url'; +import { goto } from '$app/navigation'; +import type { RegisterDto, RegisterSsoDto } from '../../types'; +import { get } from 'svelte/store'; + +export async function registerFirebase( + dto: RegisterSsoDto, + callbackfn: () => void, + admin: boolean = false +) { + if (dto.uid == '' || dto.token == '' || !dto.email?.includes('@') || dto.username == '') return; + try { + const req = await fetch(get(apiBase) + '/api/auth/register/sso', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify(dto) + }); + if (req.ok) { + const data = await req.json(); + if (!admin) goto('/login?msg=' + data.message); + } else { + callbackfn(); + } + } catch { + callbackfn(); + console.error('fallo al intentar alcanzar el servidor'); + } +} diff --git a/src/lib/stores/usuario.ts b/src/lib/stores/usuario.ts index aa1b2e5..df9f7b5 100644 --- a/src/lib/stores/usuario.ts +++ b/src/lib/stores/usuario.ts @@ -21,6 +21,10 @@ export const sesionStore = { reset: () => currentSesion.set(null) }; +sesionStore.subscribe((value) => { + console.log(value); +}); + if (browser) { currentSesion.subscribe((value) => { localStorage.setItem('sesion', JSON.stringify(value)); @@ -45,9 +49,32 @@ if (browser) { } }; - const shouldRefreshToken = (sesion: Sesion | null): boolean => { + const shouldRefreshToken = async (sesion: Sesion | null): Promise => { if (!sesion || !sesion.accessToken) return false; + if (sesion.isFirebase) { + try { + // Simulamos la importación dinámica de Firebase + const { getAuth } = await import('firebase/auth'); + const auth = getAuth(); + const user = auth.currentUser; + + if (user) { + const token = await user.getIdToken(true); + currentSesion.update((s) => { + if (s) { + return { ...s, accessToken: token }; + } + return s; + }); + return false; + } + } catch (error) { + console.error('Error obteniendo token de Firebase:', error); + return false; + } + } + const decoded = decodeJWT(sesion.accessToken); if (!decoded || !decoded.exp) return false; @@ -61,28 +88,31 @@ if (browser) { const refreshAccessToken = async () => { try { const sesion = get(currentSesion); - if (!shouldRefreshToken(sesion)) return; + if (!(await shouldRefreshToken(sesion))) return; - console.log('refrescando token'); - const response = await fetch(get(apiBase) + '/api/auth/refresh', { - method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, - credentials: 'include' - }); - - if (response.ok) { - const data = await response.json(); - currentSesion.update((sesion) => { - if (sesion) { - return { ...sesion, accessToken: data.accessToken }; - } - return sesion; + // Solo ejecutar este código si NO es Firebase + if (!sesion?.isFirebase) { + console.log('refrescando token'); + const response = await fetch(get(apiBase) + '/api/auth/refresh', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + credentials: 'include' }); - } else { - console.error('Error refrescando token:', response.statusText); - currentSesion.set(null); + + if (response.ok) { + const data = await response.json(); + currentSesion.update((sesion) => { + if (sesion) { + return { ...sesion, accessToken: data.accessToken }; + } + return sesion; + }); + } else { + console.error('Error refrescando token:', response.statusText); + currentSesion.set(null); + } } } catch (error) { console.error('Error refrescando token:', error); @@ -90,6 +120,9 @@ if (browser) { } }; - setInterval(refreshAccessToken, 30 * 1000); // Check every 30 seconds + setInterval(() => { + refreshAccessToken(); + }, 30 * 1000); // Check every 30 seconds + refreshAccessToken(); } diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte index 276fa50..d630172 100644 --- a/src/routes/login/+page.svelte +++ b/src/routes/login/+page.svelte @@ -4,6 +4,9 @@ import AlertCircleIcon from '@lucide/svelte/icons/alert-circle'; import { fade, fly } from 'svelte/transition'; import Info from '@lucide/svelte/icons/info'; + import Card from '@/components/ui/card/card.svelte'; + import CardContent from '@/components/ui/card/card-content.svelte'; + import FireBaseButton from '@/components/FireBaseButton.svelte'; let { data } = $props(); @@ -41,6 +44,12 @@ {/if} + + + + + + {#if showAlert}
diff --git a/src/routes/register/+page.svelte b/src/routes/register/+page.svelte index 51c0ead..618bcf3 100644 --- a/src/routes/register/+page.svelte +++ b/src/routes/register/+page.svelte @@ -27,7 +27,7 @@ - + {#if showAlert} diff --git a/src/types.d.ts b/src/types.d.ts index 1ebbe92..9e13ad0 100644 --- a/src/types.d.ts +++ b/src/types.d.ts @@ -39,6 +39,7 @@ export interface Sesion { displayName: string; username: string; isAdmin: boolean; + isFirebase: boolean; } export interface LoginDto { @@ -46,6 +47,11 @@ export interface LoginDto { password: string?; } +export interface LoginSsoDto { + accessToken: string; + uid: string; +} + export interface RegisterDto { username: string; email: string; @@ -53,6 +59,14 @@ export interface RegisterDto { displayName: string; } +export interface RegisterSsoDto { + username: string; + email: string; + displayName: string; + token: string; + uid: string; +} + export interface CreatePostDto { content: string; imageUrl: string?;