Named client graph api Access token validation failure. Invalid audience

Question

I have a .NET blazor wasm app that is using an api endpoint that is built into the solution , and trying to make use of the ms graph api too. I have two named clients one for the app api and another for the graph api.

My Program.cs file looks like this (Blazor WASM .NET 6 hosted model).

builder.Services.AddScoped(sp => sp.GetRequiredService<IHttpClientFactory>().CreateClient("App.ServerAPI"));
builder.Services.AddScoped(sp => sp.GetRequiredService<IHttpClientFactory>().CreateClient("App.Graph"));



builder.Services.AddHttpClient("App.ServerAPI", client => client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress)).AddHttpMessageHandler<BaseAddressAuthorizationMessageHandler>();
builder.Services.AddHttpClient("App.Graph", client => client.BaseAddress = new Uri("https://graph.microsoft.com/"));

I then go onto configure the Auth Layer like this . The graph api does not need access to the app api. My server api does not call the graph api directly.

builder.Services.AddMsalAuthentication(options =>
{
builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
options.ProviderOptions.DefaultAccessTokenScopes.Add("api://xxx-xxx-xxx-xx/API.Access");
});

builder.Services.AddMsalAuthentication<RemoteAuthenticationState, RemoteUserAccount>(options =>
{
    var scopes = builder.Configuration.GetValue<string>("GraphScopes");

    if (string.IsNullOrEmpty(scopes))
    {
        Console.WriteLine("Warning : No scope permissions founds.");
        scopes = "User.Read";
    }
    foreach (var scope in scopes.Split(";"))
    {
        global::System.Console.WriteLine($"Adding {scope} to requested permissions");
        options.ProviderOptions.DefaultAccessTokenScopes.Add(scope);

    }

   }).AddAccountClaimsPrincipalFactory<RemoteAuthenticationState, RemoteUserAccount, GraphUserAccountFactory>();

I used this example to extend/create the graph api Named client https://docs.microsoft.com/en-us/graph/tutorials/blazor

I can authenticate with each of the named clients when testing seperately, and make successful calls against both api's, but when I configure the app for capabilites to call both api's and call the ms graph api I get the following error.

Graph api Response: InvalidAuthenticationToken\nMessage: Access token validation failure. Invalid audience.

I do not have any errors on the login/auth process with both of the items listed as above.

I've looked at configuring multiple auth schemes for .NET 6 as suggested here - https://docs.microsoft.com/en-us/aspnet/core/security/authorization/limitingidentitybyscheme?view=aspnetcore-6.0#use-multiple-authentication-schemes , but the namespace is not recognized in WASM when trying to configure JWT , and the app fails to build when trying this.

I believe the Audience needs to be configured, but I am unware of how to properly achieve this in .NET 6.

Any advice on how to go about properly utilizing two named clients within one solution ? Or how to properly configure authority within the scope of the graph client ? Thanks