Docs

Docs

Handling Session Expiration

How to detect session expiration, for example to show a login view to the user.

You can use the built-in middleware InvalidSessionMiddleWare to detect when a user session expires.

This middleware requires a function as a constructor parameter (type of OnInvalidSessionCallback). The function should return a promise of LoginResult, containing the metadata of a login result, including:

error

Indicates whether the login attempt has failed.

token

In the event of a successful login, this is the cross-site request forgery (CSRF) prevention token, which can be extracted from the index.html page. See CSRF protection of Hilla endpoints for more information.

errorTitle

A short text describing a login error.

errorMessage

A more detailed explanation of the login error.

Example

As an example, you can use the InvalidSessionMiddleware to show a login view to the user.

import { ConnectClient, InvalidSessionMiddleware } from '@vaadin/hilla-frontend';
import { setSessionExpired } from '../auth';
const client = new ConnectClient({
  prefix: 'connect',
  middlewares: [
    new InvalidSessionMiddleware(async () => {
      setSessionExpired();
      const { LoginView } = await import('./login-overlay');
      return LoginView.showOverlay();
    }),
  ],
});
export default client;