Access token retrieved with MSAL does not contain group IDs

Question

I want to include group IDs in the access token retrieved with MSAL in my React web client. I retrieve the access token with:

const accessToken = await instance.acquireTokenSilent({
    scopes: [
      "https://graph.windows.net/Group.Read.All",
      "https://graph.windows.net/User.Read",
    ],
    account: accounts[0],
  })
).accessToken;

I have granted the app registration the Microsoft Graph API Group.Read.All (delegated) permission in Azure. I have also added groups as an optional claim in the Token configuration section. So the app manifest now has the following properties:

{
    "accessTokenAcceptedVersion": 2,
    (...)
    "groupMembershipClaims": "SecurityGroup",
    (...)
    "optionalClaims": {
        "accessToken": [
            {
                "name": "groups",
                "source": null,
                "essential": false,
                "additionalProperties": []
            }
        ],
    },
    (...)
}

I successfully retrieve a access token with a valid signature. The access token also include the following claim:

{
   "scp": "Group.Read.All User.Read"
}

, but it is missing the expected groups claim which should include a list of group IDs. What have I configured incorrectly?

It seems like the id_token retrieved with MSAL contains the group IDs, but not the access token.

Answer 1

Note that: Using the manifest of the resource, access tokens are generated not by using the client. To get the optional claims in the access token request the token for your application. Refer this MsDoc.

• As you are generating access token for https://graph.windows.net/ that is the resource is Microsoft Graph hence the access token is generated for the client not your application.
• Modifying the Manifest and requesting access token for other resources doesn't fetch claims in access token.

Hence to get the Group IDs in the access token, Expose an API like below:

Grant the API permissions:

Now I generated access token by passing scope as api://ClientID/test.read

https://login.microsoftonline.com/TenantID/oauth2/v2.0/token

client_id:ClientID
scope:api://xxx/test.read 
grant_type:authorization_code
redirect_uri:https://jwt.ms
client_secret:ClientSecret
code:code

When I decoded the access token, Group IDs are displayed:

Modify your code like below:

const accessToken = await instance.acquireTokenSilent({
    scopes: [
      "api://ClientID/ScopeName",
          ],
    account: accounts[0],
  })
).accessToken;