AzureActiveDirectory (AAD) custom auth provider is broken in 2.0.3

[chuanqisun]

Before filing this issue, please ensure you're using the latest CLI by running swa --version and comparing to the latest version on npm.

Are you accessing the CLI from the default port :4280 ?

• [ ] No, I am using a different port number (--port) and accessing the CLI from that port
• [x] Yes, I am accessing the CLI from port :4280

Make sure you are accessing the URL printed in the console when running swa start!

ℹ️ NOTE: Make sure to enable debug logs when running any swa commands using --verbose=silly

Describe the bug AAD sign-in either works locally or remotely, depending on the format of the openIdIssuer url in the staticwebapp.config.json, but never in both environments.

In staticwebapp.config.json This works locally

{
  "openIdIssuer": "https://login.microsoftonline.com/<tenant-id>/oauth2/v2.0",
}

But when deployment, I get ERR_TOO_MANY_REDIRECTS in the browser.

This works when deployed

{
  "openIdIssuer": "https://login.microsoftonline.com/<tenant-id>/v2.0",
}

But in local emulator, I get 404 - This login.microsoftonline.com page can't be found

To Reproduce Steps to reproduce the behavior:

To reproduce this, you would have to set up an Azure tenant with an AAD app in it. Here is my full staticwebapp.config.json for reference

{
  "platform": {
    "apiRuntime": "node:20"
  },
  "auth": {
    "identityProviders": {
      "azureActiveDirectory": {
        "registration": {
          "openIdIssuer": "https://login.microsoftonline.com/***********************************/v2.0",
          "clientIdSettingName": "AAD_CLIENT_ID",
          "clientSecretSettingName": "AZURE_CLIENT_SECRET_APP_SETTING_NAME"
        }
      }
    }
  },
  "routes": [
    {
      "route": "/*",
      "allowedRoles": [
        "authenticated"
      ]
    }
  ],
  "responseOverrides": {
    "401": {
      "statusCode": 302,
      "redirect": "/.auth/login/aad"
    }
  }
}

Expected behavior Clear guidance on whether to include oauth2 in the URL and a consistent behavior between local and deployed environments.

Screenshots

Desktop (please complete the following information):

• OS: Windows 11
• Edge: Version 134.0.3124.72 (Official build) (64-bit)

Additional context The documentation site says we should not use oauth2 in the url, but I have consulted with a library maintainer who said the documentation site is outdated.

For Microsoft internal contact, please use alias chusun

[chuanqisun]

I was able to confirm that v2.0.2 works just fine and it is broken since v2.0.3

[chuanqisun]

#928 is a related issue.

[ciacco85]

#928 is a related issue.

#941 this, too

[jassent]

I am having the same problem. v2.0.2 works fine. Upgrading to a more recent version breaks and will not load the SWA login page with an error for path /.auth/login/aad "azure_client_id not found in env for 'aad' provider" not being found. Reverting the CLI to version 2.0.2 restored proper function. Using a version greater than 2.0.2 won't load the SWA CLI user interface to populate the identity with username, roles, claims, etc.

[johnnyreilly]

This appears to be the code that is triggering this behaviour:

https://github.com/Azure/static-web-apps-cli/pull/905/files#diff-1c177799bcbb66654e6e5fb2b2ac83fe16794cdc36cef6fc8cd52e5ffe496fc1R47

https://github.com/Azure/static-web-apps-cli/blob/11fe14dd05840626f97ccc0cf9faf6af79b1de45/src/msha/auth/routes/auth-login-provider-custom.ts#L41-L49

[johnnyreilly]

In my case, I need to use AAD as the auth provider when deployed, but I need the local auth emulator for local dev. Prior to 2.0.3, going to /.auth/login/aad when doing local dev, took you to the SWA local auth emulator.

This changed with 2.0.3. Going to /.auth/login/aad when doing local dev results in this error message:

AAD_CLIENT_ID not found in env for 'aad' provider

A way I've been working around the issue, is to locally control the URL used for authentication that is rendered to the login link, like so:

    const authProvider =
        window.location.hostname === "localhost" ? "local" : "aad";
    const loginUrl = `/.auth/login/${authProvider}`;

    return (
        <a href={loginUrl}>Sign In</a>
    );

With this logic, when doing local dev (when window.location.hostname is "localhost") then the auth provider of "local" is used. This is not a special authProvider; really it's just an arbitrary string, and it will trigger using the SWA local auth emulator.

With this approach you can use newer versions of the SWA CLI and be able to use the SWA local auth emulator.

[ciacco85]

In my case, I need to use AAD as the auth provider when deployed, but I need the local auth emulator for local dev. Prior to 2.0.3, going to /.auth/login/aad when doing local dev, took you to the SWA local auth emulator.

This changed with 2.0.3. Going to /.auth/login/aad when doing local dev results in this error message:

AAD_CLIENT_ID not found in env for 'aad' provider

A way I've been working around the issue, is to locally control the URL used for authentication that is rendered to the login link, like so:

const authProvider =
    window.location.hostname === "localhost" ? "local" : "aad";
const loginUrl = `/.auth/login/${authProvider}`;

return (
    <a href={loginUrl}>Sign In</a>
);

With this logic, when doing local dev (when window.location.hostname is "localhost") then the auth provider of "local" is used. This is not a special authProvider; really it's just an arbitrary string, and it will trigger using the SWA local auth emulator.

With this approach you can use newer versions of the SWA CLI and be able to use the SWA local auth emulator.

Works like a charm

[dmbuk]

The same issue, either 404 in local or auth loop in Azure. @anthonychu - any chance the team can fix it? Thanks

[LongOddCode]

@johnnyreilly @chuanqisun @ciacco85 @jassent @dmbuk Thanks a ton for flagging this issue! 🍻

It looks like the project is currently using the OpenIdIssuer as the OAuth endpoint. I’ll review the entire project to address this bug, and we’ll roll out a new package once it’s fixed.

[stephlocke]

Thanks, came across this bug yday and it's a fairly hefty blocker.

In terms of reviewing functionality to resolve, @LongOddCode can you also review for fitness with Entra URLs starting with https://<tenantname>.ciamlogin.com/ and probably custom domains for Entra also https://devblogs.microsoft.com/identity/custom-url-domains/

[nk54]

Hello, I got the same issue. swa v2.0.6, using aad custom provider, it works well in production but i got 404 error when launching in local even if I put a redirect to http://localhost:4280/.auth/login/aad/callback in my app registration.

Any news on that ?

Edit : downgrade to 2.0.2 fixed the problem. In 2.0.6, changing "/.auth/login/aad" to "/.auth/login/local" (put anything instead of local except aad or any known issuer) also displays back the virtual (look screenshot below)