Usage In Passage Elements

Add a custom token store directly into the Passage elements.

Example Custom Token Store Usage in Passage Elements

See all required and supported methods in the tokenStore in Customizing Token Management.

The examples below create and pass a custom Token Store to handle storing the auth token in localstorage only, overriding the default client-side auth token handling of storing in both localstorage and cookie.

    <title>Your Page Title Here</title>
    <passage-auth app-id="<PASSAGE_APP_ID>"></passage-auth>
    <script src="" defer></script>
      // Implement Token Store and required methods
      class CustomTokenStore extends Passage.TokenStore {
        async getAuthToken() {
          const localToken = localStorage.getItem("custom_auth_token");
          return localToken ?? "";
        async setTokens(authResult) {
          localStorage.setItem("custom_auth_token", authResult.auth_token);
          if (authResult.refresh_token) {
            localStorage.setItem("custom_auth_token", authResult.refresh_token);
        async getRefreshToken() {
          const refreshToken = localStorage.getItem("custom_refresh_token");
          return refreshToken ?? undefined;
        async clearTokens() {

      // Create an instance of the Token Store
      const customTokenStore = new CustomTokenStore();

      // Pass the instance of the Token Store as a property on the Passage element
      const passageAuth = document.querySelector("passage-auth");
      passageAuth.tokenStore = customTokenStore;

Last updated