Logout
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.immutable.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
import { passport } from '@imtbl/sdk';
const passportInstance = new passport.Passport({
logoutRedirectUri: 'http://localhost:3000',
logoutMode: 'redirect',
// ...
});
// 2. authenticate user
// ... refer to the "Enable user login" page for more information
// 3. Log the user out
await passportInstance.logout();
Both the logoutMode
& logoutRedirectUri
properties are optional. If the logoutMode
is not specified, Passport will
default to the redirect
logout mode. If the logoutRedirectUri
property is not specified, Passport will default to
the first logout redirect URI that your Passport client has configured client in the Immutable Hub.
Logout modes
Redirect mode
The simplest approach is to use the 'redirect'
logout mode, which works as follows:
- The application session is cleared by removing the JWT from the browser's local storage
- The user is redirected to the Passport auth domain, where the Passport session is cleared
- 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:
- The application session is cleared by removing the JWT from the browser's local storage
- A hidden iframe is created with the Immutable auth domain's logout URL where the Passport session is cleared
- The iframe is redirected to the specified
logoutRedirectUri
- Your application handles the
logoutRedirectUri
request and invokes thelogoutSilentCallback
function. This causes the iframe to emit an event to the parent window which completes the logout flow. - The hidden iframe is removed