Hey folks,
I’m working on a React SPA that uses the implicit grant flow to authenticate users against Genesys Cloud. The login part works fine, I get the token in the URL fragment. The problem is trying to validate that token on the client side before making API calls. I don’t want to hit the introspection endpoint for every single request, that feels heavy.
I’ve been trying to decode the JWT manually using the public key from the JWKS endpoint. I grabbed the key using https://api.mypurecloud.com/oauth/jwks and picked the first key. But when I try to verify the signature with jose or jsonwebtoken in the browser, it fails.
Here is the code I’m using to fetch the keys and validate:
import { jwtDecode } from 'jwt-decode';
async function validateToken(token) {
const response = await fetch('https://api.mypurecloud.com/oauth/jwks');
const jwks = await response.json();
const key = jwks.keys[0]; // Assuming first key works for now
// Decoding payload works fine
const decoded = jwtDecode(token);
console.log(decoded);
// Signature verification fails here
// using a library like jose
try {
const { jwtVerify, importSPKI } = await import('jose');
const publicKey = await importSPKI(key.x, key.alg);
await jwtVerify(token, publicKey);
return true;
} catch (err) {
console.error('Token invalid', err);
return false;
}
}
The error I get is ERR_JWT_SIGNATURE_VERIFICATION_FAILED: signature verification failed. The payload looks correct, the iss is right, and the exp hasn’t passed. I’m wondering if I’m handling the public key format wrong? The x parameter in the JWKS response is base64url encoded. Do I need to convert it differently for the importSPKI function?
Also, is this even the right approach for a React app? I know implicit grant is discouraged for some use cases, but we’re stuck with it for this legacy integration. Any tips on validating the token locally without constant server calls?