ASP.NET Core 3.1 + React身份验证AzureDB

如何解决ASP.NET Core 3.1 + React身份验证AzureDB

我有一个包含React Client Side和Asp.net core 3.1 Web api for Backend的应用程序，我现在尝试使用AzureAD添加身份验证，只是为了不进行身份验证。

在客户端，我使用了msal库1.4版，在服务器端，我使用了Microsoft.Identity.Web的nuget包。 每次服务器端返回401时，日志均不显示任何内容。

谢谢您的帮助！我已经添加了日志和所有相关代码

[18:24:29 INF] Authorization failed.
[18:24:29 INF] Authorization failed for the request at filter 'Microsoft.AspNetCore.Mvc.Authorization.AuthorizeFilter'.
[18:24:29 INF] Executing ChallengeResult with authentication schemes (["Bearer"]).
[18:24:29 INF] AuthenticationScheme: Bearer was challenged.

import { UserAgentApplication} from "msal";


let msalConfig = {
    auth: {
        clientId: "7e3d8e08-2b42-46a8-83c1-5167d636808e",redirectUri: "http://localhost:3000",authority: "https://login.microsoftonline.com/78820852-55fa-450b-908d-45c0d911e76b",navigateToLoginRequestUrl: false
    },cache: {
        cacheLocation: "localStorage",storeAuthStateInCookie: true
    }
}


var msalInstance = new UserAgentApplication(msalConfig);


export { msalInstance };

然后在另一页中，我具有以下功能：

        const handleLoginClick = () => {
            const accessTokenRequest = {
                scopes: ["user.read"]
            }
            msalInstance.loginPopup(accessTokenRequest)
                .then(response => {
                    msalInstance.acquireTokenSilent(accessTokenRequest).then(tokenReponse => {
                            console.log(tokenReponse);
                            localStorage.setItem('token',tokenReponse.accessToken);
                            handleLoginSuccess();
                        });
                });
        }

最后在axios中发送令牌以获取请求：

var config = {
        headers: {
            'Access-Control-Allow-Origin': '*','Authorization': `Bearer` + token
        }
    };

    var response = await axios.get(`${SERVER_URL}/${API_Path}`,config,{ timeout: 15000 });

在Asp.net核心Web api上，我在ConfigureServices的Startup.cs文件中添加了

           services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
                .AddMicrosoftIdentityWebApi(Configuration);

            services.AddControllers(options =>
            {
                var policy = new AuthorizationPolicyBuilder()
                    .AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
                    .RequireAuthenticatedUser()
                    .Build();
                options.Filters.Add(new AuthorizeFilter(policy));
            });

使用配置：

  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/","Domain": "xxx.onmicrosoft.com","TenantId": "xxxxx-xxxx-xxxx-xxx-xxxx","ClientId": "xxxxx-xxxx-xxxx-xxx-xxxx",}

在我添加的Configure方法中

            app.UseRouting();

            app.UseAuthentication();
            app.UseAuthorization();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllers();
            });

解决方法

您正在请求Microsoft Graph的范围（ User.Read ）。您需要为他们的Web API请求它们。请按照A React & Redux single-page application authorizing an ASP.NET Core Web API to call MS Graph API on behalf of a signed-in user.

中详细说明的步骤进行操作