OIDC SPA
GitHubHome
v4
  • Documentation
  • Release Notes & Upgrade Instructions
v4
  • Documentation
    • πŸ”©Installation
    • πŸ‘¨β€πŸ”§Basic Usage
    • πŸ”ŒWeb API
    • ⏲️Auto Logout
    • ❗Error Management
    • 🎭Mock
    • πŸ”Tokens Renewal
    • πŸ›‘οΈGlobally Enforce Authentication
    • πŸ”User Account Management
    • πŸ”„Doing Something Only When a New Session is Created
  • Example setups
    • πŸ›£οΈTanStack Router
    • πŸ›€οΈReact Router
  • Resources
    • πŸ”‘Keycloak Configuration Guide
    • πŸ‘₯Accessing Keycloak Groups
    • πŸͺEnd of third-party cookies
    • πŸ—οΈJWT Of the Access Token
    • πŸ’¬Discord Server
  • ⭐Sponsors
Powered by GitBook
On this page

Was this helpful?

Export as PDF
  1. Documentation

Tokens Renewal

You probably don't need to do it. The token refresh is handled automatically for you, however you can manually trigger a token refresh:

import { createOidc }Β from "oidc-spa";

const oidc = await createOidc({ ... });

if( oidc.isUserLoggedIn ){
   oidc.renewToken();
}
import { useOidc } from "oidc";
import { useEffect } from "react";

function MyComponent(){

  const { renewTokens } = useOidc({ assertUserLoggedIn: true });
  
  useEffect(()=> {
      renewTokens();
  }, []);
  
  return <>...</>;

}

You can also track when the token are being refreshed:

import { createOidc }Β from "oidc-spa";

const oidc = await createOidc({ ... });

if( !oidc.isUserLoggedIn ){
    oidc.subscribeToTokensChange(() => {
        console.log("Tokens change", oidc.getTokens());
    });
}
src/oidc.ts
import { createReactOidc } from "oidc-spa/react";

export const {
    /* ... */
    getOidc
} = createReactOidc({ /* ... */ });

getOidc().then(oidc => {

    if( !oidc.isUserLoggedIn ){
        return;
    }

    oidc.subscribeToTokensChange(() => {
        console.log("Tokens change", oidc.getTokens());
    });

});

Or directly in your component:

import { useOidc } from "./oidc";

export function PotectedPage() {
    const { oidcTokens } = useOidc({ assertUserLoggedIn: true});

    useEffect(()=> {

        console.log("Tokens changed", oidcTokens);

    }, [oidcTokens]);
    
    // ...
}
PreviousMockNextGlobally Enforce Authentication

Last updated 9 months ago

Was this helpful?

πŸ”