All pages
Powered by GitBook
1 of 1

Loading...

Installation

Before starting be aware that oidc-spa is not suited for Next.js.

If you are using Next the closer alternative is to use NextAuth.js (with the Keycloak adapter if you are using Keycloak). See this guide.

If you're having issues don't hesitate to reach out on Discord!

Add the lib to your dependencies

Editing your App entrypoint

This is optional but recommended for .

First rename your entry point file from main.tsx (or main.ts) to main.lazy.tsx

Then create a new main.tsx file:

Comming soon, .

You can skip this for now. It will be explained in the dedicated setup guide:

First rename your entry point file from main.tsx

(or
main.ts
) to
main.lazy.tsx

Then create a new index.tsx file:

better performances and security
follow progress
React Router
npm install oidc-spa
yarn add oidc-spa
pnpm add oidc-spa
bun add oidc-spa
mv src/main.tsx src/main.lazy.tsx
src/main.tsx
import { oidcEarlyInit } from "oidc-spa/entrypoint";

const { shouldLoadApp } = oidcEarlyInit({
    freezeFetch: true,
    freezeXMLHttpRequest: true
});

if (shouldLoadApp) {
    import("./main.lazy");
}
mv src/index.tsx src/index.lazy.tsx
src/index.tsx
import { oidcEarlyInit } from "oidc-spa/entrypoint";

const { shouldLoadApp } = oidcEarlyInit({
    freezeFetch: true,
    freezeXMLHttpRequest: true
});
if (shouldLoadApp) {
import("./index.lazy");
}