Skip to content

Post logout redirect #133

@FabianKerz

Description

@FabianKerz

My problem

I was already successfully using the logout() method in the frontend for logging out users, which worked completely as expected. However, when I tried to define a specific post logout redirect uri like this:
logout("keycloak", "https://someurl.com");
It would not work correctly and never actually send the required "post_logout_redirect_uri" query parameter to the keycloak endpoint.

The cause

When I looked into the source code of the logout function I noticed that when calling the logout() method, the query parameter is parsed as "logout_redirect_uri":

async function logout(provider?: ProviderKeys | 'dev', logoutRedirectUri?: string): Promise<void> {
    await navigateTo(`/auth${provider ? `/${provider}` : currentProvider.value ? `/${currentProvider.value}` : ''}/logout${logoutRedirectUri ? `?logout_redirect_uri=${logoutRedirectUri}` : ''}`, { external: true, redirectCode: 302 })
    if (sessionState.value) {
      sessionState.value = undefined as unknown as UserSession
    }
  }

And when then looking into the handler in logout.get.js, the query parameter is attempted to be retrieved by "logoutRedirectUri":

const logoutParams = getQuery(event)
const logoutRedirectUri = logoutParams.logoutRedirectUri || config.logoutRedirectUri

So the parameter is sent in snake-case but tried to be read as camel-case.

I created this custom middleware which maps the query parameter name and that made it work:

if (event.path.includes("/auth/keycloak/logout")) {
    const logoutParams = getQuery(event);
    if (!('logoutRedirectUri' in logoutParams) && 'logout_redirect_uri' in logoutParams) {
      const redirectPath = `${event.path.split('?')[0]}?logoutRedirectUri=${logoutParams['logout_redirect_uri']}`;
      return sendRedirect(event, redirectPath);
    }
  }

However, since this is only a workaround for the actual problem, a real fix would be nice for a future version.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions