m1000/keycloakify-custom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add more insight

Browse Source
This commit is contained in:
garronej 2023-03-04 22:35:19 +01:00
parent b6f7521130
commit 0169d54eb7
2 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App/App.tsx
View File

@ -43,7 +43,7 @@ function ContextualizedApp() {
oidcClient.isUserLoggedIn ? oidcClient.isUserLoggedIn ?
<> <>
<h1>You are authenticated !</h1> <h1>You are authenticated !</h1>
<pre style={{ textAlign: "left" }}>{JSON.stringify(jwt_decode(oidcClient.accessToken), null, 2)}</pre> <pre style={{ textAlign: "left" }}>{JSON.stringify(jwt_decode(oidcClient.getAccessToken()), null, 2)}</pre>
<button onClick={() => oidcClient.logout({ redirectTo: "home" })}>Logout</button> <button onClick={() => oidcClient.logout({ redirectTo: "home" })}>Logout</button>
</> </>
: :

32
src/App/oidc.tsx
View File

@ -1,5 +1,5 @@
import { useState, useContext, createContext, useEffect } from "react"; import { useState, useContext, createContext, useEffect } from "react";
import keycloak_js from "keycloak-js"; import Keycloak_js from "keycloak-js";
import { id } from "tsafe/id"; import { id } from "tsafe/id";
import { addParamToUrl } from "powerhooks/tools/urlSearchParams"; import { addParamToUrl } from "powerhooks/tools/urlSearchParams";
import type { ReturnType } from "tsafe/ReturnType"; import type { ReturnType } from "tsafe/ReturnType";
@ -22,10 +22,12 @@ export declare namespace OidcClient {
export type LoggedIn = { export type LoggedIn = {
isUserLoggedIn: true; isUserLoggedIn: true;
//NOTE: It changes when renewed, don't store it. getAccessToken: ()=> string;
accessToken: string;
logout: (params: { redirectTo: "home" | "current page" }) => Promise<never>; logout: (params: { redirectTo: "home" | "current page" }) => Promise<never>;
updateTokenInfo: () => Promise<void>; //If we have sent a API request to change user's email for example
//and we want that jwt_decode(oidcClient.getAccessToken()).email be the new email
//in this case we would call this method...
updateTokenInfos: () => Promise<void>;
}; };
} }
@ -48,7 +50,7 @@ async function createKeycloakOidcClient(params: Params): Promise<OidcClient> {
log log
} = params; } = params;
const keycloakInstance = keycloak_js({ url, realm, clientId }); const keycloakInstance = new Keycloak_js({ url, realm, clientId });
let redirectMethod: ReturnType< let redirectMethod: ReturnType<
Param0<typeof createKeycloakAdapter>["getRedirectMethod"] Param0<typeof createKeycloakAdapter>["getRedirectMethod"]
@ -100,9 +102,11 @@ async function createKeycloakOidcClient(params: Params): Promise<OidcClient> {
}); });
} }
let currentAccessToken= keycloakInstance.token!;
const oidcClient = id<OidcClient.LoggedIn>({ const oidcClient = id<OidcClient.LoggedIn>({
"isUserLoggedIn": true, "isUserLoggedIn": true,
"accessToken": keycloakInstance.token!, "getAccessToken": ()=> currentAccessToken,
"logout": async ({ redirectTo }) => { "logout": async ({ redirectTo }) => {
await keycloakInstance.logout({ await keycloakInstance.logout({
"redirectUri": (() => { "redirectUri": (() => {
@ -117,21 +121,19 @@ async function createKeycloakOidcClient(params: Params): Promise<OidcClient> {
return new Promise<never>(() => { }); return new Promise<never>(() => { });
}, },
"updateTokenInfo": async () => { "updateTokenInfos": async () => {
await keycloakInstance.updateToken(-1); await keycloakInstance.updateToken(-1);
oidcClient.accessToken = keycloakInstance.token!; currentAccessToken = keycloakInstance.token!;
} }
}); });
(function callee() { (function callee() {
const msBeforeExpiration = const msBeforeExpiration = jwt_decode<{ exp: number }>(currentAccessToken)["exp"] * 1000 - Date.now();
jwt_decode<{ exp: number }>(oidcClient.accessToken)["exp"] * 1000 - Date.now();
setTimeout(async () => { setTimeout(async () => {
log?.(
`OIDC access token will expire in ${minValiditySecond} seconds, waiting for user activity before renewing` log?.(`OIDC access token will expire in ${minValiditySecond} seconds, waiting for user activity before renewing`);
);
await Evt.merge([ await Evt.merge([
Evt.from(document, "mousemove"), Evt.from(document, "mousemove"),
@ -151,9 +153,10 @@ async function createKeycloakOidcClient(params: Params): Promise<OidcClient> {
await login({ "doesCurrentHrefRequiresAuth": true }); await login({ "doesCurrentHrefRequiresAuth": true });
} }
oidcClient.accessToken = keycloakInstance.token!; currentAccessToken = keycloakInstance.token!;
callee(); callee();
}, msBeforeExpiration - minValiditySecond * 1000); }, msBeforeExpiration - minValiditySecond * 1000);
})(); })();
@ -162,7 +165,6 @@ async function createKeycloakOidcClient(params: Params): Promise<OidcClient> {
const minValiditySecond = 25; const minValiditySecond = 25;
const oidcClientContext = createContext<OidcClient | undefined>(undefined); const oidcClientContext = createContext<OidcClient | undefined>(undefined);
export function createOidcClientProvider(params: Params) { export function createOidcClientProvider(params: Params) {