WebAssembly Razor 客户端应用程序在使用管理员角色调用 Azure 中受保护的 API 时返回 401 [英] WebAssembly Razor client app return 401 while calling a protected API in Azure with Admin Role
问题描述
我有受 Azure AD 保护的 API，其中需要身份验证才能获取访问数据，我现在只公开一个简单范围的 API.
I have API protected by Azure AD where Authentication is required to get access data, where I expose the API with only one simple scope for now.
API 和客户端应用均已在 Azure AD 中注册.还为 API 配置了角色，只有具有 Admin 角色的用户才能调用我的 API.
The API and client app both are registered in Azure AD. Roles are also configured for the API, only a a user with Admin role can call my API.
我是否需要将此管理员角色也分配给客户端应用程序?还是 AccessApi 作用域就够了?
Do I need to assign this Admin role as well to the client App? or AccessApi scope is enough?
Scopes Who can consent Admin consent display name User consent display name State
api://xx User AccessApi AccessApi Enable
使用webassembly blazor 构建的客户端应用程序也在Azure AD 中注册，并配置了Api 权限 以使用delegated 访问AccessApi.
And a client application build using webassembly blazor also registered in Azure AD, and its configured with Api permission to use delegated access to AccessApi.
API / Permissions name Type Description Admin consent required Status
myApi (1)
AccessApi Delegated AccessApi No
我将 webassembly blazor 客户端应用程序配置为针对 azure 进行身份验证并获取令牌并使用该令牌调用 myApi，但是我一直收到 loading但没有任何数据显示没有任何错误.
I configured webassembly blazor client application to authenticate against azure and get token and use that token to call myApi, however I keep getting loading but no data is being displayed without any error.
我不确定这里出了什么问题?
Im not sure what went wrong here ?
program 客户端应用类:
private static string scope = @"api://xxx/AccessApi";
...
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("app");
builder.Services.AddScoped<GraphAPIAuthorizationMessageHandler>();
builder.Services.AddHttpClient("ServerAPI",
client => client.BaseAddress = new Uri("https://localhost:44314"))
.AddHttpMessageHandler<GraphAPIAuthorizationMessageHandler>();
builder.Services.AddScoped(sp => sp.GetRequiredService<IHttpClientFactory>()
.CreateClient("ServerAPI"));
builder.Services.AddMsalAuthentication(options =>
{
builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
options.ProviderOptions.DefaultAccessTokenScopes.Add(scope);
});
在 fetch data razor page 我导入了所有必要的库
At fetch data razor page I imported all necessary libraries
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject IAccessTokenProvider TokenProvider
@attribute [Authorize]
@inject NavigationManager UriHelper
@inject HttpClient Http
...
data = await Http.GetFromJsonAsync<data[]>(@"API-url--runs-locally-on-docker");
授权消息处理类
private static string scope = @"api://xxx/AccessApi";
public GraphAPIAuthorizationMessageHandler(IAccessTokenProvider provider,
NavigationManager navigationManager)
: base(provider, navigationManager)
{
ConfigureHandler(
authorizedUrls: new[] { "https://localhost:44314" },
scopes: new[] { scope });
}
使用 Azure AD 帐户对自己进行身份验证后，客户端应用程序显示 loading.. 但没有显示任何数据.在控制台级别显示此错误.
After authenticated myself with Azure AD account, the client app shows loading.. but no data is being displayed.
at the console level shows this error.
Failed to load resource: the server responded with a status of 401 (Unauthorized)
我遵循了 Microsoft 文档，但不确定我在这里遗漏了什么.这里可能有什么问题?
I followed Microsoft documentation and I'm not sure what I'm missing here. what could be wrong here ?
更新
Api 公开选项卡:
客户端应用程序的 Api 权限:
Api permission for the client app:
推荐答案
显然，您的 scope 设置不正确.您应该将范围设置为 api 应用程序 的客户端 ID，而不是客户端应用程序的客户端 ID.在你的问题中，我认为你的范围应该是:api://7b4d6df9-63cd-4ed7-881bxxx/AccessApi.
Obviously, your scope is set incorrectly. You should set the scope to the client id of the api application instead of the client id of the client application. In your question, I think your scope should be: api://7b4d6df9-63cd-4ed7-881bxxx/AccessApi.
解析令牌，您应该看到 scp 声明和 roles 声明.
Parse the token and you should see scp claim and roles claim.
这篇关于WebAssembly Razor 客户端应用程序在使用管理员角色调用 Azure 中受保护的 API 时返回 401的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
