ASP.NET Core 6 和 ReactJS Azure 身份验证集成

问：

我正在尝试获得一个 ReactJS 网站，以便能够与围绕我们庄园设置的 Web API 进行通信。我们使用 Azure 集成 SSO，我希望能够使用它，以便用户可以使用 React 前端登录，然后使用该登录从我们的 Web API 请求数据。我一直在尝试让它工作，但我无法在 ASP.NET Core 6 控制器操作中获取用户详细信息，但它似乎既不存在于 User 对象中，也不存在于 Request 的“access_token”属性中。

我们在 React 前端使用“@azure/msal-react”对用户进行身份验证。它在那里工作正常 - 用户能够通过 SSO 登录并被 React 应用程序识别。

使用 MSAL，我调用 MsGraph 来获取用户的详细信息：

 instance.acquireTokenSilent({
        ...loginRequest,
        account: accounts[0]
      }).then((response) => {
        callMsGraph(response.accessToken).then(r => {
          const gData: GraphData = {
            givenName: r.givenName,
            surname: r.surname,
            userPrincipalName: r.userPrincipalName,
            id: r.id,
            accessToken: response.accessToken,
            authToken: r.authToken
          };
          props.setGraphData(gData);
        });

得到 后，我这样调用我们的 Web API：accessToken

export async function getAvailableSites(accessToken: string) {
    const url = `${process.env.REACT_APP_baseurl}/Controller/Action`;
    const headers = new Headers();
    const bearer = `Bearer ${accessToken}`;

        headers.append("Authorization", bearer);

    const options = {
        method: "GET",
        headers: headers
    };

    const result = await fetch(url, options);
    const jsonData = await result.json();
    return jsonData;
}

我在 ASP.NET 中配置了身份验证，如下所示：

services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
        .AddJwtBearer("Bearer", options =>
                    {
                        options.TokenValidationParameters = new TokenValidationParameters
                        {
                            ValidateIssuer = true,
                            ValidateAudience = true,
                            ValidateIssuerSigningKey = true,
                        };
                    })
        .AddMicrosoftIdentityWebApp(AzureADConfig)
        .EnableTokenAcquisitionToCallDownstreamApi(graphApiScopes)
        .AddMicrosoftGraph(Configuration.GetSection("GraphAPI"))
        .AddInMemoryTokenCaches();

services.AddCors(o =>
            {
                o.AddPolicy("AllowReactJSPolicy", p =>
                {
                    p.WithOrigins("*");
                });
            });

控制器操作标记为“Authorize”，但 access_token 属性中没有任何内容：

    [Authorize]
    public async Task<JsonResult> Action()
    {
        var accessToken = await HttpContext.GetTokenAsync("access_token");
    }

该对象也是空的。User

我可以获取原始的“授权”HTTP标头，并像这样从中获取数据：

        if (!string.IsNullOrWhiteSpace(token))
        {
            var handler = new JwtSecurityTokenHandler();

            var jsonToken = handler.ReadToken(token);
        }

但大多数数据都是加密的。无论如何 - 肯定有一种比 HTTP 标头的原始处理更好的处理方法，不是吗？

我真的需要知道用户是谁，因为它是我稍后执行的方法之一的必要参数。我还想确保用户得到了适当的验证，并且 ASP.NET Core 不只是让每个请求都通过。

如果没有使用SSO的能力，React.js实际上对我们毫无用处。