angularazureazure-active-directory

Azure AD Authentication redirects me to "{domain}/.auth/login/done" after "{domain}/.auth/login/aad/callback"?

I have an angular application deployed on Azure App Services and have enabled Azure's built-in authentication on it (aka Easy Auth). I am able to successfully login to my identity provider (AAD) but after being redirected to {domain}/.auth/login/aad/callback, I am again further redirected to {domain}/.auth/login/done. Any attempt to navigate back to the base URL just loops back around (since presumably whatever code or token produced hasn't been sent back to the application).

/done endpoint:

done url

App registration redirect URIs: redirect uris

Network request captured, showing the matching redirect URI: network tab

Some more context: I only get this issue in the deployed instances. When building the front-end locally, the redirect URI is just set to localhost:4200 (defined in the SPA platform) and everything works as intended. However, just having {domain}/.auth/login/aad/callback under the "SPA" platform led to a PKCE error, so I followed this post and added both "web" and "single-page application" platforms.

I have seen the following posts but they appear to be doing some authentication on the server side:

  1. Azure Active Directory always redirects to '~/.auth/login/done' when deployed to Azure despite working on localhost
  2. Web application with Azure Active Directory always redirects to the '~/.auth/login/done' URL
Solution

  • If you're using MSAL angular try disabling Azure's built in authentication for the client side apps in app services.