Error while login with Microsoft Active directory using Reactjs

Question

I am attempting to log in with Microsoft using ReactJS with Client ID and Tenant ID. It is functioning correctly for one of my applications, but it is displaying an error for the other application.

Here is the code I am currently utilizing:

import {
  PublicClientApplication,
} from "@azure/msal-browser";

const msalConfig = {
  auth: {
    clientId: "bd0f7574-xxxx-xxxx-xxxx-xxxxxxx",
    authority:
      "https://login.microsoftonline.com/c6f6dd74-xxxxx-xxxx-xxxxx-xxxxxx",
    redirectUri: window.location.origin,
  },
};
const loginRequest = {
  scopes: ["openid", "profile", "User.Read"],
};

const msalInstance = new PublicClientApplication(msalConfig);

It's returning following error:

ServerError: invalid_request: xxxxxxxxx - [2023-11-08 07:35:52Z]: AADSTSxxxxxxxxx: Cross-origin token redemption is permitted only for the 'Single-Page Application' client-type. Request origin: 'https://www.xxxx-ai.com'. Trace ID: 0e3d94c4-xxxxxxxxxxxxxxxxx Correlation ID: 13311371-xxxxxxxxxxxxxxxx Timestamp: 2023-11-08 07:35:52Z - Correlation ID: 13311371-xxxxxxxxxxxxxxxxx - Trace ID: 0e3d94c4-xxxxxxxxxxxxxxxxxxxxxxx

Could anyone please let me know which settings we need to be adjusted to resolve this issue?

Answer 1

Initially when I tried to generate tokens using Postman via PKCE flow and got that same error:

The error "AADSTS9002326: Cross-origin token redemption is permitted only for the 'Single-Page Application' client-type. Request origin: 'https://jwt.ms'." usually occurs if the Azure AD application is configured as WEB and you are using PKCE flow like below:

Hence, to resolve the error add the redirect URL as SPA:

In your case, add https://www.xxxx-ai.com as redirect URI under SPA.

After the above setting, I am able to fetch the tokens successfully:

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

client_id:ClientID
scope:user.read openid profile
grant_type:authorization_code
code:code
code_verifier:S256
redirect_uri:https://jwt.ms