ANGLE MSAL AD 401在ANGLE应用程序中未经授权，但在Postman-ASP.NET核心Web API中正常 [英] Angular MSAL AD 401 Unauthorized in Angular App but 200 Ok in Postman - ASP.NET Core Web API

问题描述

日安，

我正在尝试使用ANGLE MSAL从ASP.NET Core Web API中提取数据，但我的ANGLE应用程序中出现错误，显示为401未经授权错误。

我尝试在浏览器的应用程序选项卡中获取access_token，并在邮递员上使用它，从技术上讲它是有效的。我只是不知道为什么它会在我的角度应用程序中抛出Unauthorized 401错误。

这是我的app.module.js

export const protectedResourceMap: [string, string[]][] = [
  ['https://graph.microsoft.com/v1.0/me', ['user.read']]
];

const isIE = window.navigator.userAgent.indexOf("MSIE ") > -1 || window.navigator.userAgent.indexOf("Trident/") > -1;

imports: [
// msal angular
     MsalModule.forRoot({
        auth: {
            clientId: 'MYCLIENTID-FROMAD',
            authority: "https://login.microsoftonline.com/common/",
            validateAuthority: true,
            redirectUri: "http://localhost:4200/",
            postLogoutRedirectUri: "http://localhost:4200/",
            navigateToLoginRequestUrl: true,
        },
        cache: {
            cacheLocation : "localStorage",
            storeAuthStateInCookie: true, // set to true for IE 11
        },
        framework: {
            unprotectedResources: ["https://www.microsoft.com/en-us/"],
            protectedResourceMap: new Map(protectedResourceMap)
        },
      }, {
        popUp: !isIE,
        extraQueryParameters: {}
    })
],
providers: [
    {
        provide: HTTP_INTERCEPTORS,
        useClass: MsalInterceptor,
        multi: true
      }
   ],

这是我的ASP.NET Core Web API主机：http://localhost:5000

其中它在其某些Controllers中实现[Authorize]。我认为我的后端有问题，因为当我使用授权标头为Bearer access_token的Postman对我的access_token进行测试时，一切都在使用我本地存储中的access_token。

Browser Application Tab after successfully login

提前谢谢您。

推荐答案

在我看来，您缺少的主要内容是受保护的资源映射配置。 目前它只定义了MS Graph API。 您也应该在那里添加您自己的API：

export const protectedResourceMap: [string, string[]][] = [
  ['https://graph.microsoft.com/v1.0/me', ['user.read']],
  ['http://localhost:5000', ['your-api-client-id/user_impersonation']]
];

将your-api-client-id替换为您的API的客户端ID/应用程序ID。 您也可以使用API的应用ID URI。 最后一部分是范围， 将user_impersonation更改为您在API上定义的作用域(可以通过在Azure门户中公开API来完成)。

现在，当它看到对http://localhost:5000的HTTP请求时，它将知道为它获取令牌并将其附加到请求。

这篇关于ANGLE MSAL AD 401在ANGLE应用程序中未经授权，但在Postman-ASP.NET核心Web API中正常的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！