.Net Core WebApi + Angular 项目中的安全 SPA答案

【问题标题】：Secure SPA in .Net Core WebApi + Angular project.Net Core WebApi + Angular 项目中的安全 SPA
【发布时间】：2020-09-23 03:56:38
【问题描述】：

我正在构建一个基于 .Net Core 3.1 + Angular 模板的应用程序。应用程序正在使用 Azure AD 对用户进行身份验证。

后端配置如下：

services.AddAuthentication(AzureADDefaults.BearerAuthenticationScheme)
        .AddAzureADBearer(options => Configuration.Bind("AzureActiveDirectory", options));

前端使用@azure/msal-angular 在第一次未经身份验证的调用时将用户重定向到 Api。这很好用。

现在我想进一步保护应用程序。我希望在用户未通过身份验证时下载角度文件或任何静态文件不。

我该如何做到这一点？如果用户未通过身份验证，如何保护根文件夹上的应用程序并将用户重定向到 Azure AD 登录页面？

【问题讨论】：

当您在令牌上收到 401 错误时，您显然会重定向到登录提示，对吗？
对，但这是在做这项工作的 javascript，这意味着 javascript 代码已经下载。如果用户未通过身份验证，我希望根本不下载该应用程序。 javascript 由后端在 ClientApp 文件夹中提供服务，它在后端使用 app.UseSpa 进行配置。
但是要查找用户是否经过身份验证，必须从客户端发生一些请求，这意味着需要在那里运行一些代码，这些代码显然会提供给浏览器。
在第一个 GET "/" 上，后端应该能够测试上下文是否经过身份验证并重定向到 AzureAd 登录页面。客户端有请求，但是如果javascript可以重定向，后端也可以。

标签： angular asp.net-core azure-active-directory asp.net-core-webapi msal

【解决方案1】：

我找到了实现这一目标的方法。（alphaz18 你的答案是正确但不完整）

首先，由于后端将重定向到 Azure AD 登录，我们可以从 SPA 中完全删除 @azure/msal-angular 模块。

现在我们需要配置后端来做这个连接

services.AddAzureAD(options => Configuration.Bind("AzureActiveDirectory", options));

在 UseSpa 之前，我们需要启动身份验证（由 alphaz18 发现）

app.Use(async (context, next) =>
{
    if (!context.User.Identity.IsAuthenticated)
    {
        await context.ChallengeAsync(AzureADDefaults.AuthenticationScheme);
    }
    else
    {
        await next();
    }
});

由于我仍然希望通过不记名身份验证访问 API，我发现 this answer 可以正确混合两者。

在 Azure AD 方面，我们不再需要注册 2 个应用程序，只需一个就足够了。

【讨论】：

对不起，如果这是一个愚蠢的问题，但是当您以这种方式设置身份验证时，SPA 如何知道在调用 API 时要发送哪些令牌？当您从客户端删除 msal 后，该部分仍然如何工作？
从 AzureAD 返回时，token 存储在 cookie 中，因此前端会随每个请求自动发送它

【解决方案2】：

根据这篇文章：Securing a SPA by authorization server before first load

您可以在使用SPA之前尝试这样做：

 app.Use(async (context, next) =>
    {
        if (!context.User.Identity.IsAuthenticated)
        {
            await context.ChallengeAsync("oidc");
        }
        else
        {
            await next();
        }
    });

不确定这是否对您有帮助，但我很想知道这是否符合您的要求。

【讨论】：

谢谢我也发现了，但还不够，我已经发布了答案。