admin/hermione-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix refresh token

Browse Source
This commit is contained in:
Emanuele Ferrelli
2025-10-22 14:03:21 +02:00
parent ffda3ad51c
commit 738f627f1f
6 changed files with 552 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/pages/auth/Callback.vue
View File

@@ -18,7 +18,7 @@ onMounted(async () => {
console.log('[Callback] After initialize on callback');
} catch (e) {
console.error('[Callback] Error during MSAL initialization:', e);
message.value = "Error during MSAL initialization.";
message.value = 'Error during MSAL initialization.';
visible.value = true;
return;
}
@@ -45,7 +45,7 @@ onMounted(async () => {
}
// Wait 2 second to avoid race condition
await new Promise(resolve => setTimeout(resolve, 2000));
await new Promise((resolve) => setTimeout(resolve, 2000));
message.value = 'Logging in to the application...';
// Token exchange function with retry
@@ -63,7 +63,7 @@ onMounted(async () => {
} catch (err) {
if (!retry) {
console.warn('[Callback] First attempt failed, waiting 1500ms and retrying...');
await new Promise(resolve => setTimeout(resolve, 1500));
await new Promise((resolve) => setTimeout(resolve, 1500));
return tryTokenExchange(true);
} else {
throw err;
@@ -85,6 +85,9 @@ onMounted(async () => {
const userResponse = await auth.fetch();
console.log('[Callback] User fetch response:', userResponse);
// Start token refresh timer after successful authentication
window.dispatchEvent(new CustomEvent('auth-login-success'));
const userData = userResponse.data?.data;
console.log('[Callback] userResponse.data.data:', userData);
@@ -116,7 +119,6 @@ onMounted(async () => {
visible.value = true;
}
});
</script>
<template>

57
src/views/pages/auth/Login.vue
View File

@@ -45,7 +45,7 @@ const tryTokenExchange = async (accessToken, retry = false) => {
} catch (err) {
if (!retry) {
console.warn('[loginAD] First attempt failed, waiting 1500ms and retrying...');
await new Promise(r => setTimeout(r, 1500));
await new Promise((r) => setTimeout(r, 1500));
return tryTokenExchange(accessToken, true);
} else {
throw err;
@@ -63,7 +63,7 @@ const loginAD = async () => {
console.log('[loginAD] Token MSAL ottenuto:', token);
// Inserisci una pausa per evitare race condition
await new Promise(r => setTimeout(r, 2000));
await new Promise((r) => setTimeout(r, 2000));
let exchangeResponse;
try {
@@ -76,6 +76,9 @@ const loginAD = async () => {
const resp = await auth.fetch();
console.log('[loginAD] User fetch response:', resp.data.data);
// Start token refresh timer after successful authentication
window.dispatchEvent(new CustomEvent('auth-login-success'));
const userData = resp.data.data;
if (!userData.selectedProject) {
console.log('[loginAD] No project selected → projects-list');
@@ -96,7 +99,7 @@ const loginAD = async () => {
}
} catch (e) {
console.error('[loginAD] Error:', e);
error.value = "Error while login AD. Contact the administrator.";
error.value = 'Error while login AD. Contact the administrator.';
visible.value = true;
}
};
@@ -115,6 +118,10 @@ const loginMsal = async () => {
const logoutAD = async () => {
console.log('[logoutAD] Logout AD...');
// Stop token refresh timer
window.dispatchEvent(new CustomEvent('auth-logout'));
const logoutRequest = {
account: msaccount.value,
mainWindowRedirectUri: window.location.href
@@ -142,6 +149,10 @@ const login_old = async () => {
})
.then((response) => {
console.log('[login_old] Login response:', response.data.data);
// Start token refresh timer after successful authentication
window.dispatchEvent(new CustomEvent('auth-login-success'));
if (!response.data.data.selectedProject) {
console.log('[login_old] No project selected, redirect to projects-list');
router.push({ name: 'projects-list' });
@@ -169,9 +180,9 @@ const login_old = async () => {
<div class="bg-surface-50 dark:bg-surface-950 flex items-center justify-center min-h-screen min-w-[100vw] overflow-hidden">
<div class="flex flex-col items-center justify-center">
<div style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
<div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
<div class="logo-container mb-8">
<svg width="85" height="63" viewBox="0 0 85 63" fill="none" xmlns="http://www.w3.org/2000/svg">
<div class="w-full bg-surface-0 dark:bg-surface-900 py-12 px-6 sm:px-12" style="border-radius: 53px">
<div class="logo-container mb-6">
<svg width="70" height="45" viewBox="0 0 85 63" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
@@ -189,36 +200,36 @@ const login_old = async () => {
</svg>
</div>
<div class="text-center mb-12">
<h1 class="text-3xl font-semibold">Welcome to</h1>
<h1 class="text-4xl font-bold text-primary">WizardAI - WORKFLOW</h1>
<div class="text-center mb-8">
<h1 class="text-2xl font-semibold">Welcome to</h1>
<h1 class="text-3xl font-bold text-primary">WizardAI - WORKFLOW</h1>
</div>
<!-- Username & Password Section -->
<div class="mb-10 w-full max-w-xl">
<label for="email1" class="block text-surface-900 dark:text-surface-0 text-l font-medium mb-2">Username</label>
<InputText id="email1" type="text" placeholder="Username" class="w-full mb-6" style="padding: 1rem" v-model="username" />
<div class="mb-6 w-full max-w-md">
<label for="email1" class="block text-surface-900 dark:text-surface-0 text-sm font-medium mb-2">Username</label>
<InputText id="email1" type="text" placeholder="Username" class="w-full mb-4" style="padding: 0.75rem" v-model="username" />
<label for="password1" class="block text-surface-900 dark:text-surface-0 font-medium text-l mb-2">Password</label>
<Password id="password1" v-model="password" placeholder="Password" :toggleMask="true" class="w-full mb-6" inputClass="w-full" :inputStyle="{ padding: '1rem' }" />
<label for="password1" class="block text-surface-900 dark:text-surface-0 font-medium text-sm mb-2">Password</label>
<Password id="password1" v-model="password" placeholder="Password" :toggleMask="true" class="w-full mb-4" inputClass="w-full" :inputStyle="{ padding: '0.75rem' }" />
<Button @click="login_old" label="Sign In with Username and Password" class="w-full text-xl mb-4" />
<Button @click="login_old" label="Sign In with Username and Password" class="w-full text-sm mb-3" />
</div>
<!-- Divider -->
<div class="my-6 w-full max-w-xl flex items-center justify-center">
<div class="my-4 w-full max-w-md flex items-center justify-center">
<hr class="flex-grow border-t border-gray-300 dark:border-gray-700" />
<span class="mx-4 text-gray-500 dark:text-gray-400">Sign in with Microsoft Azure AD</span>
<span class="mx-3 text-sm text-gray-500 dark:text-gray-400">Sign in with Microsoft Azure AD</span>
<hr class="flex-grow border-t border-gray-300 dark:border-gray-700" />
</div>
<!-- Azure AD Section -->
<div class="w-full max-w-xl">
<Button @click="loginMsal" v-if="msaccount == null" label="Sign In with Microsoft AD" class="w-full text-l mb-4" />
<div class="w-full max-w-md">
<Button @click="loginMsal" v-if="msaccount == null" label="Sign In with Microsoft AD" class="w-full text-sm mb-3" />
<Button @click="loginAD" v-if="msaccount" :label="'Login ' + msaccount.username" class="w-full text-l mb-4" />
<Button @click="loginAD" v-if="msaccount" :label="'Login ' + msaccount.username" class="w-full text-sm mb-3" />
<Button @click="logoutAD" v-if="msaccount" label="Logout AD" severity="warn" class="w-full text-l mb-4" />
<Button @click="logoutAD" v-if="msaccount" label="Logout AD" severity="warn" class="w-full text-sm mb-3" />
</div>
<!-- Error Message -->
@@ -244,8 +255,8 @@ const login_old = async () => {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
margin-top: -40px;
margin-bottom: 15px;
margin-top: -30px;
}
.error-message {