Which UI do you use?

Custom UI

Pre built UI

Handling session tokens

success

No action required.

Our frontend SDK handles everything for you. You only need to make sure that you have called supertokens.init before making any network requests.

Our SDK adds interceptors to fetch and XHR (used by axios) to save and add session tokens from and to the request.

note

By default, our web SDKs use cookies to provide credentials.

Getting the access token

caution

Our SDK automatically handles adding the access token to request headers. You only need to add the access token to the request if you want to send the access token to a different API domain than what is configured on the frontend SDK init function call.

If you are using a header-based session, you can read the access token on the frontend using the getAccessToken method:

ReactJS

import Session from "supertokens-auth-react/recipe/session";

async function getToken(): Promise<void> {
    const accessToken = await Session.getAccessToken();
    console.log(accessToken);
}

import Session from "supertokens-auth-react/recipe/session";

async function getToken(): Promise<void> {
    const accessToken = await Session.getAccessToken();
    console.log(accessToken);
}