Azure AD Authentication with .NET Core Web API

Question

We have a simple setup. Frontend web application gets a token from Azure AD. Frontend uses that token to authenticate requests to our backend .NET Core Web API. Both will be deployed as Azure Web Apps.

We have found a number of resources on this subject (Microsoft Docs, Blogs, Youtube) however, no matter what we try we are getting 401 Unauthorized errors when we send a request from the frontend to the backend.

Here is our setup:

We have 2 app registrations (one for the frontend, one for the backend)
In the Azure Portal I navigated to Azure AD -> App Registrations -> Backend App -> Expose an API -> Add Scope -> Filled out Form:
Then navigate to the Frontend app registration -> API Permissions -> Add a permission -> Add Access to API exposed in step 2.
Then select "Grant Admin Consent"
Onto the Frontend code:
On the Frontend we are using Microsoft's MSAL library. We have it configured as such:

// Frontend msal config
   {
        msalConfig: {
        auth: {
            clientId: "{frontend clientId}",
            authority: "https://login.microsoftonline.com/{tenantId}/",
            redirectUri: appUri,
            postLogoutRedirectUri: appUri,
            mainWindowRedirectUri: appUri
        },
        cache: {
            cacheLocation: 'localStorage'
        }
    }

We send a login request:

// login.js
        const request = {
            scopes: [
                "User.Read", 
                "api://{Backend Application Id From AzureAD App Registration}/access_as_user"
            ]
        };
        instance.loginPopup(request).catch(
            (error) => {
                console.log(error);
            }
        );

This works as expected and users are able to login and out of our frontend application.
We place our Azure AD provided token in our Authorization header in requests to our backend API (always returns a 401).
Backend code using Microsoft.Identity.Web (.NET 5):

// .Net appsettings.json  
 "AzureAd": {
   "Instance": "https://login.microsoftonline.com/",
   "ClientId": "{backend clientId}",
   "TenantId": "{tenantId}"
 }

// Startup.cs

using Microsoft.Identity.Web;

ConfigureServices(IServiceCollection services)
{
 //other services
 services.AddMicrosoftIdentityWebApiAuthentication(Configuration, "AzureAd");
 //other services
}

Configure(IApplicationBuilder app, IWebHostEnvironment env)
{ 
 // other config
 app.UseRouting();
 app.UseAuthentication();
 app.UseAuthorization();
 // other config
}

Any help on how to proceed would be greatly appreciated. We are testing locally right now, but once we get auth working we will be deploying the frontend & backend applications to Azure Web Apps.

UPDATE:

I can see in the 401 response headers that I am getting:

Bearer error="invalid_token", error_description="The signature is invalid"

Are your API endpoints protected with the Authorize attribute? If so, how are you authenticating the user? — Eric Legault
– Eric Legault, Commented Feb 3, 2022 at 22:23
I have placed the [Authorize] attribute on my controller yes. Users are authenticating on the client side with Azure AD, then sending their tokens to my backend api which is returning nothing but 401 errors — BryceBy
– BryceBy, Commented Feb 3, 2022 at 23:06
Did you try to decode your token and compare scope and audience parameters? Does scope(or scp) have value access_as_user? Does audience (or aud) contain backend client id? It could be that token (provided to backend) is actually for Microsoft Graph. — Serhii
– Serhii, Commented Feb 3, 2022 at 23:18
@Serhii The token I am getting on the frontend and sending to the backend does not appear to have either in the token payload. "scp": "openid profile User.Read email" ... "aud": "00000003-0000-0000-c000-000000000000" — BryceBy
– BryceBy, Commented Feb 3, 2022 at 23:25
You are using a token for Microsoft Graph (check appId here: shawntabrizi.com/aad/…). The frontend has received a token for MS Graph and sent it to the backend — Serhii
– Serhii, Commented Feb 3, 2022 at 23:28

Serhii · Accepted Answer · 2022-02-03 23:48:27Z

3

Try to add "Audience" parameter into AzureAD section: "Audience": "api://{Client_Id}".
To receive more info about auth you can pass subscribeToJwtBearerMiddlewareDiagnosticsEvents: true into services.AddMicrosoftIdentityWebApiAuthentication and check your logs after unsuccessful request.
Also, you can decode(https://jwt.io) your token and check the payload section if there are required scope and audience.
It could be that token (provided to backend) is actually for Microsoft Graph(check appId here: shawntabrizi.com/aad/…). If "scp" is "openid profile User.Read email" and "aud" is "00000003-0000-0000-c000-000000000000" then you are using the wrong token for your backend. Ask Frontend to check the way how they are receiving a token.

Frontend guy put something like this into code, correct me if I am wrong:

 
 public static msalInterceptorConfigFactory(): MsalInterceptorConfiguration {
    const resourceMap = new Map<string, Array<string>>();
    resourceMap.set(environment.apiUrl, [environment.scope]);

    return {
      interactionType: InteractionType.Redirect,
      resourceMap
    };
  }

  public static msalGuardConfigFactory(): MsalGuardConfiguration {
    return {
      interactionType: InteractionType.Redirect,
      authRequest: {
        scopes: [environment.scope]
      }
    };
  }

# module.ts
 providers: [
...
    {
      provide: MSAL_GUARD_CONFIG,
      useFactory: msalGuardConfigFactory
    },
    {
      provide: MSAL_INTERCEPTOR_CONFIG,
      useFactory: msalInterceptorConfigFactory
    },
...
  ],

edited Feb 3, 2022 at 23:48

answered Feb 3, 2022 at 22:49

Serhii

7531 gold badge4 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

kintela Over a year ago

Hi @Serhii I have replicated this in my project and I get the error is invalid audience when the aud claim is It is the one that I copied and pasted from the azure portal and scp claim the same too

Serhii Over a year ago

Hi @kintela, what configuration you are using for backend side?

kintela Over a year ago

Hi @Serhii is shown in my post

Collectives™ on Stack Overflow

Azure AD Authentication with .NET Core Web API

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related