We’ve switched our React dashboard to use the implicit grant flow to avoid the redirect loop issues we were having with PKCE. The login works fine and we get the id_token in the URL hash. The problem is validating it on the client side before making calls to /api/v2/interaction/conversations.
I’m using jose to verify the signature. The public keys from /.well-known/jwks.json seem correct, but verify throws Error: Invalid signature. I’ve checked the issuer and audience claims, they match. The token looks valid in jwt.io using the public key.
Here’s the verification logic:
import { importSPKI, jwtVerify } from 'jose';
const jwksUrl = 'https://api.mypurecloud.com/.well-known/jwks.json';
const keys = await fetch(jwksUrl).then(r => r.json());
const findKey = (header) => {
return keys.keys.find(k => k.kid === header.kid);
};
const validateToken = async (jwtString) => {
const payload = await jwtVerify(jwtString, findKey, {
algorithms: ['RS256'],
issuer: 'https://api.mypurecloud.com',
audience: 'my-client-id'
});
return payload.payload;
};
The error happens immediately on load.
- React 18.2
- Genesys Cloud EU region
josev4.14.0- Implicit grant flow
- No proxy layer, direct browser call
I’ve tried forcing the key ID to match the first key in the JWKS array just to test, same result. The token expires in an hour, so it’s not a stale token issue. Anyone else hit this with the implicit flow?