Log out a user

Log out a user

This page instructs you how to log users out of Passport and your application.

Pre-requisites​

• The user must be logged into your application via Passport

How to logout a user?​

When a user authenticates through Passport, there are two "sessions" you need to account for. The Passport session layer maintains a session between the user and Passport in auth.XpansionChain.com, and the application session layer maintains a session between the user and your application through JWTs.

In order to log out a user from your application and Passport, you can use the logout function on the Passport instance.

Depending on the logout mode you specify, the user will be redirected to the Passport auth domain or silently logged out within your application. You can specify the logout mode when you initialize the Passport instance by setting the logoutMode to either 'redirect' or 'silent'.

// 1. Initialise Passport and set the preferred logout mode
const passport = new Passport({
  logoutRedirectUri: 'http://localhost:3000',
  logoutMode: 'redirect', // defaults to 'redirect' if not set
  // ...
});

// 2. authenticate user
// ... refer to the "Enable user login" page for more information

// 3. Log the user out
await passport.logout();

Logout modes​

Redirect mode​

The simplest approach is to use the 'redirect' logout mode, which works as follows:

1. The application session is cleared by removing the JWT from the browser's local storage

2. The user is redirected to the Passport auth domain, where the Passport session is cleared

3. The user is redirected back to the specified logoutRedirectUri

Silent mode​

Alternatively, you can use the 'silent' logout mode which is less intrusive and does not require a top-level redirect. However, in order to use this mode, you must set up a callback URL that invokes the logoutSilentCallback function:

// Assume your application is hosted in http://localhost:3000
// 1. Initialise Passport and set the preferred logout mode
const pasport = new Passport({
  logoutRedirectUri: 'http://localhost:3000/silent-logout',
  logoutMode: 'silent',
  // ...
});

// 2. authenticate user
// ... refer to the "Enable user login" page for more information

// 3. Log the user out
await passport.logout();

// 4. Route handler for /silent-logout
await passport.logoutSilentCallback('http://localhost:3000');

The logoutSilentCallback function accepts a single parameter, which is the URL of the page that initiated the logout. In other words, if you initiate the logout from http://localhost:3000, then you should pass http://localhost:3000.

The 'silent' logout mode works as follows:

1. The application session is cleared by removing the JWT from the browser's local storage

2. A hidden iframe is created with the XpansionChain auth domain's logout URL where the Passport session is cleared

3. The iframe is redirected to the specified logoutRedirectUri

4. Your application handles the logoutRedirectUri request and invokes the logoutSilentCallback function. This causes the iframe to emit an event to the parent window which completes the logout flow.

5. The hidden iframe is removed

Next steps​

Now that you've integrated Passport into your application & set up the login flow, you are ready to integrate more of the Passport functionality. Learn more about how authentication works in Passport in the Identity guide.