Invalid access token payload, jwt encrypted with A256GCM

Hi everyone,

I’m trying to set up a Vue3 SPA with a NestJS API in the back. I set up my Auth0 tenant and client to integrate with the SPA and plan to send the resulting JWTs to my API. In my SPA, I use the vue-auth0-plugin, which uses @auth0/auth0-spa-js under the hood.

I have successfully set up the Auth Code with PKCE flow, up to the point where I receive id, access and refresh tokens. However, something is wrong with the access token and I cannot understand why it is happening. The payload is invalid JSON and the token contains 2 consecutive .. When I paste the token into jwt.io, the header is decoded as follows:

{
  "alg": "dir",
  "enc": "A256GCM",
  "iss": "https://xyz.auth0.com/"
}

I would be expecting:

{
  "alg": "RS256",
  "typ": "JWT",
  "kid": "w1-e..."
}

I have not enabled JWT encryption as far as I know (I used the wizard to set up the SPA client), could anyone point out to me what I am missing? For the sake of completeness, this is the format of my auth request:

https://xyz.auth0.com/authorize
    ?client_id=REq...
    &redirect_uri=http%3A%2F%2Flocalhost%3A1337
    &scope=openid%20profile%20email
    &response_type=code
    &response_mode=query
    &state=a2...
    &nonce=bT...
    &code_challenge=GjSw...
    &code_challenge_method=S256
    &auth0Client=eyJu...

Many thanks in advance,

2 Likes

Solved, I needed to include an audience to receive a valid JWT. This was not very clear from the documentation.

8 Likes

Glad you have figured it out yourself! I’m gonna relay that to our docs team!

1 Like