fix(logout): should work correctly with multiple tabs (release)

AxaFrance · Aug 8, 2024 · dd94789 · dd94789
1 parent 23ae6ba
commit dd94789
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 29 deletions.
diff --git a/packages/oidc-client-service-worker/src/OidcServiceWorker.ts b/packages/oidc-client-service-worker/src/OidcServiceWorker.ts
@@ -367,9 +367,11 @@ const handleMessage = async (event: ExtendableMessageEvent) => {
   switch (data.type) {
     case 'clear':
       currentDatabase.tokens = null;
-      currentDatabase.tabIds = [];
-      currentDatabase.state = {};
-      currentDatabase.codeVerifier = {};
+      currentDatabase.tabIds = currentDatabase.tabIds.filter(id => id !== tabId);
+      delete currentDatabase.state[tabId];
+      delete currentDatabase.codeVerifier[tabId];
+      delete currentDatabase.nonce[tabId];
+
       currentDatabase.demonstratingProofOfPossessionNonce = null;
       currentDatabase.demonstratingProofOfPossessionJwkJson = null;
       currentDatabase.demonstratingProofOfPossessionConfiguration = null;

diff --git a/packages/oidc-client/src/initWorker.ts b/packages/oidc-client/src/initWorker.ts
@@ -57,6 +57,18 @@ export const defaultServiceWorkerUpdateRequireCallback =
     location.reload();
   };
 
+const getTabId = (configurationName: string) => {
+  const tabId = sessionStorage.getItem(`oidc.tabId.${configurationName}`);
+
+  if (tabId) {
+    return tabId;
+  }
+
+  const newTabId = globalThis.crypto.randomUUID();
+  sessionStorage.setItem(`oidc.tabId.${configurationName}`, newTabId);
+  return newTabId;
+};
+
 const sendMessageAsync =
   registration =>
   (data): Promise<any> => {
@@ -72,23 +84,13 @@ const sendMessageAsync =
         messageChannel.port1.close();
         messageChannel.port2.close();
       };
-      registration.active.postMessage(data, [messageChannel.port2]);
+      registration.active.postMessage({ ...data, tabId: getTabId(data.configurationName) }, [
+        messageChannel.port2,
+      ]);
     });
   };
 
 export const initWorkerAsync = async (configuration, configurationName) => {
-  const getTabId = () => {
-    const tabId = sessionStorage.getItem(`oidc.tabId.${configurationName}`);
-
-    if (tabId) {
-      return tabId;
-    }
-
-    const newTabId = globalThis.crypto.randomUUID();
-    sessionStorage.setItem(`oidc.tabId.${configurationName}`, newTabId);
-    return newTabId;
-  };
-
   const serviceWorkerRelativeUrl = configuration.service_worker_relative_url;
   if (
     typeof window === 'undefined' ||
@@ -138,7 +140,6 @@ export const initWorkerAsync = async (configuration, configurationName) => {
         },
       },
       configurationName,
-      tabId: getTabId(),
     });
 
     // @ts-ignore
@@ -183,23 +184,19 @@ export const initWorkerAsync = async (configuration, configurationName) => {
   };
 
   const setNonceAsync = nonce => {
-    const tabId = getTabId();
     sessionStorage[`oidc.nonce.${configurationName}`] = nonce.nonce;
     return sendMessageAsync(registration)({
       type: 'setNonce',
       data: { nonce },
       configurationName,
-      tabId,
     });
   };
   const getNonceAsync = async () => {
-    const tabId = getTabId();
     // @ts-ignore
     const result = await sendMessageAsync(registration)({
       type: 'getNonce',
       data: null,
       configurationName,
-      tabId,
     });
     // @ts-ignore
     let nonce = result.nonce;
@@ -267,12 +264,10 @@ export const initWorkerAsync = async (configuration, configurationName) => {
   };
 
   const getStateAsync = async () => {
-    const tabId = getTabId();
     const result = await sendMessageAsync(registration)({
       type: 'getState',
       data: null,
       configurationName,
-      tabId,
     });
     // @ts-ignore
     let state = result.state;
@@ -284,23 +279,19 @@ export const initWorkerAsync = async (configuration, configurationName) => {
   };
 
   const setStateAsync = async (state: string) => {
-    const tabId = getTabId();
     sessionStorage[`oidc.state.${configurationName}`] = state;
     return sendMessageAsync(registration)({
       type: 'setState',
       data: { state },
       configurationName,
-      tabId,
     });
   };
 
   const getCodeVerifierAsync = async () => {
-    const tabId = getTabId();
     const result = await sendMessageAsync(registration)({
       type: 'getCodeVerifier',
       data: null,
       configurationName,
-      tabId,
     });
     // @ts-ignore
     let codeVerifier = result.codeVerifier;
@@ -312,13 +303,11 @@ export const initWorkerAsync = async (configuration, configurationName) => {
   };
 
   const setCodeVerifierAsync = async (codeVerifier: string) => {
-    const tabId = getTabId();
     sessionStorage[`oidc.code_verifier.${configurationName}`] = codeVerifier;
     return sendMessageAsync(registration)({
       type: 'setCodeVerifier',
       data: { codeVerifier },
       configurationName,
-      tabId,
     });
   };