89 lines
3.4 KiB
TypeScript
89 lines
3.4 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import { useSession } from "next-auth/react";
|
|
import { clearAuthCookies } from "@/lib/session";
|
|
|
|
export function SignOutHandler() {
|
|
const { data: session } = useSession();
|
|
|
|
useEffect(() => {
|
|
const handleSignOut = async () => {
|
|
try {
|
|
// First, clear all auth-related cookies to ensure we break any local sessions
|
|
clearAuthCookies();
|
|
|
|
// Get Keycloak logout URL
|
|
if (process.env.NEXT_PUBLIC_KEYCLOAK_ISSUER) {
|
|
console.log('Preparing complete Keycloak logout');
|
|
|
|
// Create a proper Keycloak logout URL with all required parameters for front-channel logout
|
|
const keycloakBaseUrl = process.env.NEXT_PUBLIC_KEYCLOAK_ISSUER;
|
|
const logoutEndpoint = `${keycloakBaseUrl}/protocol/openid-connect/logout`;
|
|
|
|
// Create form for POST logout (more reliable)
|
|
const form = document.createElement('form');
|
|
form.method = 'POST';
|
|
form.action = logoutEndpoint;
|
|
|
|
// Add id_token_hint if available
|
|
if (session?.accessToken) {
|
|
const tokenInput = document.createElement('input');
|
|
tokenInput.type = 'hidden';
|
|
tokenInput.name = 'id_token_hint';
|
|
tokenInput.value = session.accessToken;
|
|
form.appendChild(tokenInput);
|
|
}
|
|
|
|
// Add client_id parameter - CRITICAL for proper logout
|
|
const clientIdInput = document.createElement('input');
|
|
clientIdInput.type = 'hidden';
|
|
clientIdInput.name = 'client_id';
|
|
clientIdInput.value = process.env.NEXT_PUBLIC_KEYCLOAK_CLIENT_ID || 'lab';
|
|
form.appendChild(clientIdInput);
|
|
|
|
// Add post_logout_redirect_uri pointing to our logged out page
|
|
const redirectInput = document.createElement('input');
|
|
redirectInput.type = 'hidden';
|
|
redirectInput.name = 'post_logout_redirect_uri';
|
|
redirectInput.value = `${window.location.origin}/loggedout`;
|
|
form.appendChild(redirectInput);
|
|
|
|
// Add logout_hint=server to explicitly request server-side session cleanup
|
|
const logoutHintInput = document.createElement('input');
|
|
logoutHintInput.type = 'hidden';
|
|
logoutHintInput.name = 'logout_hint';
|
|
logoutHintInput.value = 'server';
|
|
form.appendChild(logoutHintInput);
|
|
|
|
// Append to body and submit
|
|
document.body.appendChild(form);
|
|
console.log('Submitting Keycloak logout form with server-side logout');
|
|
form.submit();
|
|
} else {
|
|
console.log('No Keycloak configuration found, performing simple redirect');
|
|
window.location.href = '/loggedout';
|
|
}
|
|
} catch (error) {
|
|
console.error('Error during logout:', error);
|
|
window.location.href = '/loggedout';
|
|
}
|
|
};
|
|
|
|
// Add a slight delay to ensure useSession has loaded
|
|
const timer = setTimeout(() => {
|
|
handleSignOut();
|
|
}, 100);
|
|
|
|
return () => clearTimeout(timer);
|
|
}, [session]);
|
|
|
|
return (
|
|
<div className="w-full h-full flex items-center justify-center">
|
|
<div className="text-center">
|
|
<h2 className="text-2xl font-bold">Logging out...</h2>
|
|
<p className="text-gray-500 mt-2">Please wait while we sign you out completely.</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|