From 2578555ace1204c8c6e2ea1b69055040f7b6c9f2 Mon Sep 17 00:00:00 2001 From: Gerald Schmittinger Date: Tue, 22 Apr 2025 11:04:24 +0200 Subject: [PATCH 1/3] fix(frontend): Login state blijft behouden voor andere tabs binnen dezelfde browser. --- frontend/src/App.vue | 3 +++ frontend/src/main.ts | 2 -- frontend/src/router/index.ts | 2 +- frontend/src/services/auth/auth-service.ts | 14 +++++++++++++- 4 files changed, 17 insertions(+), 4 deletions(-) diff --git a/frontend/src/App.vue b/frontend/src/App.vue index b1207448..dbb62e79 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -3,6 +3,9 @@ import MenuBar from "@/components/MenuBar.vue"; import { useRoute } from "vue-router"; import { computed } from "vue"; + import authService from "@/services/auth/auth-service.ts"; + + void authService.loadUser(); const route = useRoute(); interface RouteMeta { diff --git a/frontend/src/main.ts b/frontend/src/main.ts index e4bdde40..b5315634 100644 --- a/frontend/src/main.ts +++ b/frontend/src/main.ts @@ -12,11 +12,9 @@ import App from "./App.vue"; import router from "./router"; import { aliases, mdi } from "vuetify/iconsets/mdi"; import { VueQueryPlugin, QueryClient } from "@tanstack/vue-query"; -import authService from "./services/auth/auth-service.ts"; const app = createApp(App); -await authService.loadUser(); app.use(router); const link = document.createElement("link"); diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts index 1eeb8865..901d376f 100644 --- a/frontend/src/router/index.ts +++ b/frontend/src/router/index.ts @@ -138,7 +138,7 @@ const router = createRouter({ router.beforeEach(async (to, _from, next) => { // Verify if user is logged in before accessing certain routes if (to.meta.requiresAuth) { - if (!authService.isLoggedIn.value) { + if (!authService.isLoggedIn.value && !await authService.loadUser()) { next("/login"); } else { next(); diff --git a/frontend/src/services/auth/auth-service.ts b/frontend/src/services/auth/auth-service.ts index 9151e0a9..92b5002d 100644 --- a/frontend/src/services/auth/auth-service.ts +++ b/frontend/src/services/auth/auth-service.ts @@ -37,7 +37,19 @@ async function loadUser(): Promise { if (!activeRole) { return null; } - const user = await (await getUserManagers())[activeRole].getUser(); + + const userManager = (await getUserManagers())[activeRole]; + let user = await userManager.getUser(); // Load the user from the local storage. + if (!user) { // If the user is not in the local storage, he could still be authenticated in Keycloak. + try { + user = await userManager.signinSilent() + } catch (e: unknown) { + // When the user was previously logged in and then logged out, signinSilent throws an error. + // In that case, the user is not authenticated anymore, so we set him to null. + user = null; + } + } + setUserAuthInfo(user); authState.activeRole = activeRole ?? null; return user; From 868c5d9afe867daf897780a98c7e735ca3bb5649 Mon Sep 17 00:00:00 2001 From: Lint Action Date: Tue, 22 Apr 2025 09:12:11 +0000 Subject: [PATCH 2/3] style: fix linting issues met Prettier --- frontend/src/router/index.ts | 2 +- frontend/src/services/auth/auth-service.ts | 5 +++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts index 901d376f..8092ffd5 100644 --- a/frontend/src/router/index.ts +++ b/frontend/src/router/index.ts @@ -138,7 +138,7 @@ const router = createRouter({ router.beforeEach(async (to, _from, next) => { // Verify if user is logged in before accessing certain routes if (to.meta.requiresAuth) { - if (!authService.isLoggedIn.value && !await authService.loadUser()) { + if (!authService.isLoggedIn.value && !(await authService.loadUser())) { next("/login"); } else { next(); diff --git a/frontend/src/services/auth/auth-service.ts b/frontend/src/services/auth/auth-service.ts index 92b5002d..0d67380c 100644 --- a/frontend/src/services/auth/auth-service.ts +++ b/frontend/src/services/auth/auth-service.ts @@ -40,9 +40,10 @@ async function loadUser(): Promise { const userManager = (await getUserManagers())[activeRole]; let user = await userManager.getUser(); // Load the user from the local storage. - if (!user) { // If the user is not in the local storage, he could still be authenticated in Keycloak. + if (!user) { + // If the user is not in the local storage, he could still be authenticated in Keycloak. try { - user = await userManager.signinSilent() + user = await userManager.signinSilent(); } catch (e: unknown) { // When the user was previously logged in and then logged out, signinSilent throws an error. // In that case, the user is not authenticated anymore, so we set him to null. From 97b07ff2e56b3cd4a6aa6c827e853597916fd708 Mon Sep 17 00:00:00 2001 From: Gerald Schmittinger Date: Tue, 22 Apr 2025 11:16:33 +0200 Subject: [PATCH 3/3] fix(frontend): linting probleem --- frontend/src/services/auth/auth-service.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/services/auth/auth-service.ts b/frontend/src/services/auth/auth-service.ts index 0d67380c..a813cd6e 100644 --- a/frontend/src/services/auth/auth-service.ts +++ b/frontend/src/services/auth/auth-service.ts @@ -44,7 +44,7 @@ async function loadUser(): Promise { // If the user is not in the local storage, he could still be authenticated in Keycloak. try { user = await userManager.signinSilent(); - } catch (e: unknown) { + } catch (_: unknown) { // When the user was previously logged in and then logged out, signinSilent throws an error. // In that case, the user is not authenticated anymore, so we set him to null. user = null;