diff --git a/front-nuxt/app/middleware/auth.global.ts b/front-nuxt/app/middleware/auth.global.ts index 48dcf15..b74d06a 100644 --- a/front-nuxt/app/middleware/auth.global.ts +++ b/front-nuxt/app/middleware/auth.global.ts @@ -1,43 +1,45 @@ import { USER_SESSION_STORAGE_KEY } from "~/constants/session.constants"; import type { User } from "~/stores/user"; +const LOGIN_ROUTE = "/login"; + export default defineNuxtRouteMiddleware((to, from) => { let session: string | null = null; - // Not secured routes + // Not secured route// Recover user session if ( to.path.startsWith("/favicon.ico") || to.path.startsWith("/assets/") || - to.path.startsWith("/login") + to.path.startsWith(LOGIN_ROUTE) ) { return; } - const userStore = useUserStore(); - userStore.update({ id: "test", roles: ["admin"] }); - // Recover user session // NOTE: using the sessionStorage will not allow the user to have multiple tabs, to communicate them one can use the - // broadcast channel: https://developer.mozilla.org/en-US/docs/Web/API/Broadcast_Channel_API + // broadcast channel, although its not the safest way: https://developer.mozilla.org/en-US/docs/Web/API/Broadcast_Channel_API try { session = sessionStorage.getItem( USER_SESSION_STORAGE_KEY, ); + + // Manage secured routes + if (session) { + const user = JSON.parse(session) as User; + if ( + user.apiSession?.exp && + user.apiSession.exp > Date.now() + ) { + // try refresh token if it exists + // else just redirect to login + return navigateTo(LOGIN_ROUTE); + } + } else { + return navigateTo(LOGIN_ROUTE); + } } catch (e) { console.error(">> [!] Not in client"); } - // Manage secured routes - if (session) { - const user = JSON.parse(session) as User; - if ( - user.apiSession?.exp && - user.apiSession.exp > Date.now() - ) { - // try refresh token - // else just redirect to login - } - } - console.log(">> Global Middleware from ", from.path); }); diff --git a/front-nuxt/app/stores/user.ts b/front-nuxt/app/stores/user.ts index 12f75e6..dc41810 100644 --- a/front-nuxt/app/stores/user.ts +++ b/front-nuxt/app/stores/user.ts @@ -13,11 +13,15 @@ export interface User { roles: Role[]; image?: string; name?: string; - apiSession?: ApiSession; + apiSession: ApiSession; } export const useUserStore = defineStore("user", { - state: (): User => ({ id: "-1", roles: [] }), + state: (): User => ({ + id: "-1", + roles: [], + apiSession: { accessToken: "" }, + }), getters: { profile: (state) => ({ id: state.id, @@ -25,13 +29,14 @@ export const useUserStore = defineStore("user", { image: state.image, roles: state.roles, }), + token: (state) => state.apiSession?.accessToken, }, actions: { persist() { try { sessionStorage.setItem( USER_SESSION_STORAGE_KEY, - JSON.stringify(this.profile), + JSON.stringify(this.token), ); } catch (e) { console.error( @@ -40,9 +45,13 @@ export const useUserStore = defineStore("user", { ); } }, - update(user: User) { + setUser(user: User) { this.$state = user; this.persist(); }, + updateToken(token: ApiSession["accessToken"]) { + this.apiSession.accessToken = token; + this.persist(); + }, }, });