fix: detect and clear stale IndexedDB auth tokens (refs #190)
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -57,8 +57,9 @@ export const Auth0Provider: React.FC<Auth0ProviderProps> = ({ children }) => {
|
|||||||
|
|
||||||
// Component to inject token into API client with mobile support
|
// Component to inject token into API client with mobile support
|
||||||
const TokenInjector: React.FC<{ children: React.ReactNode }> = ({ children }) => {
|
const TokenInjector: React.FC<{ children: React.ReactNode }> = ({ children }) => {
|
||||||
const { getAccessTokenSilently, isAuthenticated, isLoading, user } = useAuth0();
|
const { getAccessTokenSilently, isAuthenticated, isLoading, user, logout } = useAuth0();
|
||||||
const [retryCount, setRetryCount] = React.useState(0);
|
const [retryCount, setRetryCount] = React.useState(0);
|
||||||
|
const validatingRef = React.useRef(false);
|
||||||
|
|
||||||
// Basic component loading debug
|
// Basic component loading debug
|
||||||
console.log('[TokenInjector] Component loaded');
|
console.log('[TokenInjector] Component loaded');
|
||||||
@@ -116,6 +117,31 @@ const TokenInjector: React.FC<{ children: React.ReactNode }> = ({ children }) =>
|
|||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Prevent stale session state when cached token is no longer valid
|
||||||
|
React.useEffect(() => {
|
||||||
|
if (!isAuthenticated || isLoading || validatingRef.current) return;
|
||||||
|
|
||||||
|
const validateToken = async () => {
|
||||||
|
validatingRef.current = true;
|
||||||
|
try {
|
||||||
|
await getAccessTokenSilently({ cacheMode: 'off', timeoutInSeconds: 10 });
|
||||||
|
} catch (error: any) {
|
||||||
|
const errorType = error?.error || error?.message || '';
|
||||||
|
if (errorType.includes('login_required') || errorType.includes('consent_required') ||
|
||||||
|
errorType.includes('invalid_grant')) {
|
||||||
|
console.warn('[Auth] Stale token detected, clearing auth state');
|
||||||
|
const { indexedDBStorage } = await import('../utils/indexeddb-storage');
|
||||||
|
await indexedDBStorage.clearAll();
|
||||||
|
logout({ openUrl: false });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
validatingRef.current = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
validateToken();
|
||||||
|
}, [isAuthenticated, isLoading]);
|
||||||
|
|
||||||
// Force authentication check for devices when user seems logged in but isAuthenticated is false
|
// Force authentication check for devices when user seems logged in but isAuthenticated is false
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
const isMobile = /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
const isMobile = /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
||||||
|
|||||||
@@ -157,6 +157,23 @@ class IndexedDBStorage implements StorageAdapter, Auth0Cache {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async clearAll(): Promise<void> {
|
||||||
|
await this.initPromise;
|
||||||
|
if (!this.db) {
|
||||||
|
this.memoryCache.clear();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const tx = this.db.transaction(this.storeName, 'readwrite');
|
||||||
|
tx.objectStore(this.storeName).clear();
|
||||||
|
await new Promise<void>((resolve, reject) => {
|
||||||
|
tx.oncomplete = () => {
|
||||||
|
this.memoryCache.clear();
|
||||||
|
resolve();
|
||||||
|
};
|
||||||
|
tx.onerror = () => reject(tx.error);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
key(index: number): string | null {
|
key(index: number): string | null {
|
||||||
const keys = Array.from(this.memoryCache.keys());
|
const keys = Array.from(this.memoryCache.keys());
|
||||||
return keys[index] || null;
|
return keys[index] || null;
|
||||||
|
|||||||
Reference in New Issue
Block a user