Fix SSR and defensive coding for Keycloak integration
- Add proper SSR guards and error handling - Make authentication middleware more defensive - Add null checks in useUnifiedAuth composable - Prevent JavaScript errors from breaking page load - Prioritize Directus auth over Keycloak for stability
This commit is contained in:
parent
a797c13867
commit
8c7bf4cc00
|
|
@ -9,7 +9,7 @@ export const useKeycloak = () => {
|
|||
const isInitialized = ref(false)
|
||||
|
||||
const initKeycloak = async () => {
|
||||
if (process.server) return
|
||||
if (process.server) return false
|
||||
|
||||
try {
|
||||
// Dynamically import keycloak-js
|
||||
|
|
|
|||
|
|
@ -15,8 +15,8 @@ export const useUnifiedAuth = () => {
|
|||
|
||||
// Create unified user object
|
||||
const user = computed<UnifiedUser | null>(() => {
|
||||
// Check Keycloak user first
|
||||
if (keycloak.user.value) {
|
||||
// Check Keycloak user first (safely)
|
||||
if (keycloak.user?.value) {
|
||||
const keycloakUser = keycloak.user.value;
|
||||
// Construct name from firstName and lastName if available
|
||||
let name = keycloakUser.name;
|
||||
|
|
|
|||
|
|
@ -5,36 +5,53 @@ export default defineNuxtRouteMiddleware(async (to) => {
|
|||
// Check if auth is required (default true unless explicitly set to false)
|
||||
const isAuthRequired = to.meta.auth !== false;
|
||||
|
||||
// Check Keycloak auth first
|
||||
const keycloak = useKeycloak();
|
||||
|
||||
// Initialize Keycloak if not already initialized
|
||||
if (!keycloak.isInitialized.value) {
|
||||
await keycloak.initKeycloak();
|
||||
}
|
||||
|
||||
if (keycloak.isAuthenticated.value) {
|
||||
// User authenticated with Keycloak
|
||||
return;
|
||||
}
|
||||
try {
|
||||
// Check Directus auth first (more reliable)
|
||||
const { fetchUser, setUser } = useDirectusAuth();
|
||||
const directusUser = useDirectusUser();
|
||||
|
||||
if (!directusUser.value) {
|
||||
try {
|
||||
const user = await fetchUser();
|
||||
setUser(user.value);
|
||||
} catch (error) {
|
||||
// Ignore directus auth errors
|
||||
}
|
||||
}
|
||||
|
||||
// Fall back to Directus auth
|
||||
const { fetchUser, setUser } = useDirectusAuth();
|
||||
const directusUser = useDirectusUser();
|
||||
|
||||
if (!directusUser.value) {
|
||||
const user = await fetchUser();
|
||||
setUser(user.value);
|
||||
}
|
||||
if (directusUser.value) {
|
||||
// User authenticated with Directus
|
||||
return;
|
||||
}
|
||||
|
||||
if (directusUser.value) {
|
||||
// User authenticated with Directus
|
||||
return;
|
||||
}
|
||||
// Try Keycloak auth (only if we need it)
|
||||
if (isAuthRequired) {
|
||||
const keycloak = useKeycloak();
|
||||
|
||||
// Only try to initialize if not already done
|
||||
if (!keycloak.isInitialized.value) {
|
||||
try {
|
||||
await keycloak.initKeycloak();
|
||||
} catch (error) {
|
||||
console.error('Keycloak init failed:', error);
|
||||
}
|
||||
}
|
||||
|
||||
if (keycloak.isAuthenticated.value) {
|
||||
// User authenticated with Keycloak
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// No authentication found
|
||||
if (isAuthRequired) {
|
||||
// Redirect to login page
|
||||
return navigateTo('/login');
|
||||
// No authentication found
|
||||
if (isAuthRequired) {
|
||||
// Redirect to login page
|
||||
return navigateTo('/login');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Auth middleware error:', error);
|
||||
if (isAuthRequired) {
|
||||
return navigateTo('/login');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue