How to fix AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption error in msal react application.

Question

How to fix AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption error in msal react application.

Chris Ebright 45

I am deploying a nextjs app to azure app service with msal-react for authentication. everything works fine locally and using localhost as redirect uri. when i deploy to my hosted app service on azure i can get it to work briefly, but then i always end up getting the error: AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption. i have tried all combinations of redirect uri's but nothing has worked.

Chris Ebright 45 Reputation points

2023-03-30T22:06:21.7033333+00:00

I tried changing the platform to web based on that stackoverflow link, but i got a different error.

I am using the react version of msal 2 .0 library

i have the following redirect uri's in my app registration config for a spa platform.

https://<site>/.auth/login/aad/callback

http://localhost:3000

these map to the values i am using in my auth config in the application code.

i noticed that this ran successfully periodically, but as soon as i clear my cache and try again, i get the pkce error.
Arun Siripuram 911 Reputation points

2023-03-31T16:39:57.85+00:00

@Chris Ebright

Thank you for reaching out to Microsoft Q&A.

The error "AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption" indicates that the authorization code was sent from a different origin than the redirect URI specified in the initial authorization request. This is a security feature designed to prevent unauthorized access to the user's access tokens.

To fix this issue, you need to ensure that the redirect URI specified in your initial authorization request matches the redirect URI specified in the Azure AD application registration. You also need to ensure that the same redirect URI is used in both the initial authorization request and the subsequent token request.

Please refer the below links which could solve this problem

Request an authorization code

https://learn.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-auth-code-flow#request-an-authorization-code

https://stackoverflow.com/questions/64692600/aadsts9002325-proof-key-for-code-exchange-is-required-for-cross-origin-authoriz
Chris Ebright 45 Reputation points

2023-03-31T17:28:11.4533333+00:00
Chris Ebright 45 Reputation points

2023-03-31T17:28:14.5566667+00:00
Chris Ebright 45 Reputation points

2023-03-31T17:28:56.7533333+00:00

I ran fiddler and show that the redirect uri that my app is sending is the same as in the app registration
SnehaAgrawal-MSFT 22,721 Reputation points Moderator

2023-04-10T09:05:19.56+00:00

@Chris Ebright Apologies for late response here! Could you please send an email with subject line “Attn:Sneha |thread title” to AzCommunity[at]microsoft[dot]com referencing this thread, since this needs further deep investigation would like to work closely on resolving this issue. Thanks.
Chris Ebright 45 Reputation points

2023-04-12T21:40:26.28+00:00

just sent email.
Anonymous

2023-04-20T10:21:14.7+00:00

Maybe you've to use the Web Application instead of Single-page Application. It did work for me. https://community.auth0.com/t/proof-key-for-code-exchange-is-required-for-cross-origin-authorization-code-redemption/44529/12
Anonymous

2023-05-19T10:45:11.74+00:00
I have the same issue, would be interested to know if anything came of this or what the fix was?

To reiterate, I have a React app served as static site on an express app. Using Enterprise application sso auth to login via AzureAD, I get the same 'AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption.'

I have the <url>/.auth/login/aad/callback redirect url set under SPA in Azure authentication settings, and this is the redirectUri I send into the auth config of the PublicClientApplication class in the React app (msal-browser).

I can add the redirectUrl to web instead of SPA in Azure and this lets me login but puts me into a redirect loop of some kind, and feels wrong as I only want the token via the client, I only use it via passport to protect my express app routes.

My React config

new PublicClientApplication({ auth: { clientId: config.clientId, authority: `https://login.microsoftonline.com/${config.tenantId}`, redirectUri: config.azureAd.redirectUrl, // "<site-url>/.auth/login/aad/callback" postLogoutRedirectUri: "/", clientCapabilities: ["CP1"], }, cache: { cacheLocation: "sessionStorage", storeAuthStateInCookie: false, }, system: { logger: new Logger(() => {}, { level: LogLevel.Verbose, piiLoggingEnabled: false, }), } }

Any suggestions would be most welcome - or if more info is required let me know!

2 answers

Your answer

Chris Ebright 45 Reputation points

2023-03-30T22:06:21.7033333+00:00

I tried changing the platform to web based on that stackoverflow link, but i got a different error.

I am using the react version of msal 2 .0 library

i have the following redirect uri's in my app registration config for a spa platform.

https://<site>/.auth/login/aad/callback

http://localhost:3000

these map to the values i am using in my auth config in the application code.

i noticed that this ran successfully periodically, but as soon as i clear my cache and try again, i get the pkce error.
Arun Siripuram 911 Reputation points

2023-03-31T16:39:57.85+00:00

@Chris Ebright

Thank you for reaching out to Microsoft Q&A.

The error "AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption" indicates that the authorization code was sent from a different origin than the redirect URI specified in the initial authorization request. This is a security feature designed to prevent unauthorized access to the user's access tokens.

To fix this issue, you need to ensure that the redirect URI specified in your initial authorization request matches the redirect URI specified in the Azure AD application registration. You also need to ensure that the same redirect URI is used in both the initial authorization request and the subsequent token request.

Please refer the below links which could solve this problem

Request an authorization code

https://learn.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-auth-code-flow#request-an-authorization-code

https://stackoverflow.com/questions/64692600/aadsts9002325-proof-key-for-code-exchange-is-required-for-cross-origin-authoriz
Chris Ebright 45 Reputation points

2023-03-31T17:28:11.4533333+00:00
Chris Ebright 45 Reputation points

2023-03-31T17:28:14.5566667+00:00
Chris Ebright 45 Reputation points

2023-03-31T17:28:56.7533333+00:00

I ran fiddler and show that the redirect uri that my app is sending is the same as in the app registration
SnehaAgrawal-MSFT 22,721 Reputation points Moderator

2023-04-10T09:05:19.56+00:00

@Chris Ebright Apologies for late response here! Could you please send an email with subject line “Attn:Sneha |thread title” to AzCommunity[at]microsoft[dot]com referencing this thread, since this needs further deep investigation would like to work closely on resolving this issue. Thanks.
Chris Ebright 45 Reputation points

2023-04-12T21:40:26.28+00:00

just sent email.
Anonymous

2023-04-20T10:21:14.7+00:00

Maybe you've to use the Web Application instead of Single-page Application. It did work for me. https://community.auth0.com/t/proof-key-for-code-exchange-is-required-for-cross-origin-authorization-code-redemption/44529/12
Anonymous

2023-05-19T10:45:11.74+00:00

I have the same issue, would be interested to know if anything came of this or what the fix was?

To reiterate, I have a React app served as static site on an express app. Using Enterprise application sso auth to login via AzureAD, I get the same 'AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption.'

I have the <url>/.auth/login/aad/callback redirect url set under SPA in Azure authentication settings, and this is the redirectUri I send into the auth config of the PublicClientApplication class in the React app (msal-browser).

I can add the redirectUrl to web instead of SPA in Azure and this lets me login but puts me into a redirect loop of some kind, and feels wrong as I only want the token via the client, I only use it via passport to protect my express app routes.

My React config

new PublicClientApplication({ auth: { clientId: config.clientId, authority: `https://login.microsoftonline.com/${config.tenantId}`, redirectUri: config.azureAd.redirectUrl, // "<site-url>/.auth/login/aad/callback" postLogoutRedirectUri: "/", clientCapabilities: ["CP1"], }, cache: { cacheLocation: "sessionStorage", storeAuthStateInCookie: false, }, system: { logger: new Logger(() => {}, { level: LogLevel.Verbose, piiLoggingEnabled: false, }), } }

Any suggestions would be most welcome - or if more info is required let me know!

Answer 1

Camille 45

The redirect_uri of the external sso / idp should be registered as a "Web" instead of SPA.

I had the same issue with my project, my Azure AD tenant set up as an identity provider was giving me "AADSTS9002325: Proof Key for Code Exchange is required for cross-origin authorization code redemption error".

https://learn.microsoft.com/en-us/azure/active-directory-b2c/identity-provider-azure-ad-single-tenant?pivots=b2c-user-flow

I set it up based on this but had everything changed to SPA as I thought that was what was needed based on the SPA tutorials which i followed: https://learn.microsoft.com/en-us/azure/active-directory-b2c/configure-authentication-sample-react-spa-app

I was at a lost and changed a lot of parameters, I tried changing everything to web but it caused some errors afterwards, it seems the best is to only change the auth resp to web. I don't exactly understand why either but it fixed the PKCE error without any of the other weirdness.

marc charmois 0 Reputation points

2023-09-01T11:53:14.9333333+00:00

Thank you! That worked for me.
Admin JR 0 Reputation points

2023-10-02T14:16:35.7466667+00:00

This worked for me as well. Could anyone explain why? It seems a bit odd to add the callback as a web redirect URI on a SPA.
Vladimir Tsitovtsev 5 Reputation points

2023-10-26T17:35:20.3366667+00:00

The same for me. Finally I changed call back URL to web to have microsoft account working. email and google sign-in worked with SPA call-backs.
Eric Hopper 0 Reputation points

2023-12-21T15:17:18.3033333+00:00

This fixed this error for me also. I left the B2C registered app as SPA, but changed the registered app in the AAD tenant to Web. fixed!
Quentin Krenger 1 Reputation point

2024-03-19T06:42:24.7066667+00:00

Legend. This worked for me as well. Was working fine from my swagger web app until I tried to authenticate from the developer portal on my API Management.
Cristian Moreno 0 Reputation points

2025-03-21T02:12:18.9966667+00:00

It's working now, good cacth!

Answer 2

Steve Dodge 10

Problem fixed by moving the callback url http://localhost:3000/api/auth/callback/azure-ad into the Web platform section In my case I got this error because I am using Next.js and with nextauth.js for Azure AD. Next.js and NextAuth utilize React server components which essentially is a classic 2-tier client/web-server architecture and the Oauth is carried out on the web server side. Moving the callback URL into the "Web Platform" section avoids the CORS error I got when my callback was full client side in the "Single Page App Platform" section. Without a deep dive, I speculate single page apps using the msal library conduct the Oauth choreography solely in the browser in javascript and CORS is handled differently

Sanjay Prasad 0 Reputation points

2024-05-08T08:43:47.4866667+00:00

As per the documentation Mine is SPA only, but showing pkce issue, as move to spa to web it will open but the token will not generate. Are you guying getting token as well after moving to SPA.