Handling Session Expiration

Use the built-in middleware InvalidSessionMiddleWare to detect session expiration. You could use this, for example, to show a login view to the user.

How to Use the InvalidSessionMiddleWare

InvalidSessionMiddleWare requires OnInvalidSessionCallback as a constructor parameter. OnInvalidSessionCallback is a function that takes no parameters and should return a promise of LoginResult. LoginResult contains 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 Vaadin Endpoints for more information.

errorTitle

A short text describing a login error.

errorMessage

A more detailed explanation of the login error.

Example using InvalidSessionMiddleWare
import { ConnectClient, InvalidSessionMiddleware } from '@vaadin/flow-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;