azure active directory access_token validation fails

Question

I use a setup where I have a frontend (Vue3) and a backend (python fastapi) component. The frontend fetches an access_token from AAD (not B2C - The app is being used internally and all users are members of the used tenant) using the following code:

const msalInstance = new PublicClientApplication(
  this.api.msalConfig,
);
const request = {scopes: ["openid", "profile"]}
await msalInstance.loginPopup(request);
const token_response = await msalInstance.acquireTokenPopup({})

where msalConfig looks like this:

msalConfig: {
        auth: {
          clientId: '9116d117-...-fdb12f53b040',
          authority:
            'https://login.microsoftonline.com/4e11c215-...-9d28f5bd3c11',
        },
        cache: {
          cacheLocation: 'localStorage',
        },
      }

The appication is registered with single page redirect, API permission for Directory.ReadAll and User.Read and with "Assignment required: True".

If I put the token I receive into jwt.ms, I get "This token was issued by Azure Active Directory and all data is there. If I put it into jwt.io, I also receive all data, but the Signature is invalid.

I tried several attempts to validate the token and finally sticked to azure_ad_verify_token.verify_jwt library which results in an InvalidSignatureError. I assume I am fetching a wrong token, but I have no idea how/where to fetch a verifyable version.

This is the header of the token I receive:

{
  "typ": "JWT",
  "nonce": "5fp8kB_rTylKZjKF2nIDR7PT8HPkUkjtdl8PqDo4atY",
  "alg": "RS256",
  "x5t": "2ZQpJ3UpbjAYXYGaXEJl8lV0TOI",
  "kid": "2ZQpJ3UpbjAYXYGaXEJl8lV0TOI"
}

I'm happy for any suggestion.

Answer 1

1. Please make sure to use scopes parameter as " clientid/.default " when calling your own api when we use MSAL.js and Ensure you've selected the correct signing algorithm (RS256).(not in case of graph api). ex: scopes:["<clientidhere>/.default"]

2. Also note that the token, if you are recieving token for Graph API. If not needed for graph and if it is token that is intended for your own API, you may need to expose an API app and give the permissions in AAD to consent.

See: Azure AD 2.0 Troubleshooting – OAuth Architecture Guidance (authguidance.com)

3. Please note that if token has nonce field in the JWT header, we may not need to validate Microsoft graph signature, as Microsoft API has to validate.If we do this jwt will fail standard signature based validation as it tries to add more security to the jwt with nonce.
4. To Validate this token, the nonce will need to be replaced with the SHA2 of the nonce in the header

References:

1. node.js - Azure AD Invalid Signature of Access Token using Passport.js - Stack Overflow
2. AzureAD issues | github