Blazor和Web API解决方案中的.NET核心身份

问题描述

我正在创建Blazor应用程序（.NET Core，C＃），并对如何集成.NET Core的内置身份验证和授权服务（.NET Core身份）感到困惑。

我有一个解决方案，其中包含Blazor应用程序的项目，以及用于从后端数据库检索数据的.NET Core API项目。

我看过一些在Blazor应用程序中实现.NET Core身份的教程（以及所有用于注册，登录等的预构建页面和组件）。

这很好，但是当我还构建用于数据访问的API时，我觉得还应该在Web API部分中实现身份验证等，因为这是需要进行数据访问的授权。

设计此方法的最佳/正确方法是什么？

解决方法

我正在创建Blazor应用程序（.NET Core，C＃），并对如何集成.NET Core的内置身份验证和授权服务（.NET Core身份）感到困惑。

您可以参考这份有关“ Scaffold Identity into a Blazor Server project without existing authorization”的文档，将ASP.NET Core身份集成到Blazor项目中，这将有助于添加所需的库并为您配置身份。

然后，您应该在Blazor项目中进行一些修改：

在LoginDisplay.razor文件夹下添加Shared

<AuthorizeView>
    <Authorized>
        <a href="Identity/Account/Manager">Hello,@context.User.Identity.Name!</a>
        <form method="post" action="Identity/Account/LogOut">
            <button type="submit" class="nav-link btn btn-link">Log out</button>
        </form>
    </Authorized>
    <NotAuthorized>
        <a href="Identity/Account/Register">Register</a>
        <a href="Identity/Account/Login">Login</a>
    </NotAuthorized>
</AuthorizeView>

在LoginDisplay中的

引用MainLayout.razor

@inherits LayoutComponentBase

<div class="sidebar">
    <NavMenu />
</div>

<div class="main">
    <div class="top-row px-4">
        <LoginDisplay></LoginDisplay>
        <a href="https://docs.microsoft.com/aspnet/" target="_blank">About</a>
    </div>

    <div class="content px-4">
        @Body
    </div>
</div>

如下更新App.razor

<Router AppAssembly="@typeof(Program).Assembly">
    <Found Context="routeData">
        <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
    </Found>
    <NotFound>
        @*<LayoutView Layout="@typeof(MainLayout)">
                <p>Sorry,there's nothing at this address.</p>
            </LayoutView>*@
        <CascadingAuthenticationState>
            <LayoutView Layout="@typeof(MainLayout)">
                <p>Sorry,there's nothing at this address.</p>
            </LayoutView>
        </CascadingAuthenticationState>
    </NotFound>
</Router>

Startup类中的

配置

public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    // For more information on how to configure your application,visit https://go.microsoft.com/fwlink/?LinkID=398940
    public void ConfigureServices(IServiceCollection services)
    {
        //... 
        //other configurations here

        services.AddRazorPages();
        services.AddServerSideBlazor();

        services.AddScoped<AuthenticationStateProvider,ServerAuthenticationStateProvider>();
        services.AddSingleton<WeatherForecastService>();
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app,IWebHostEnvironment env)
    {
        //...
        //other configurations here

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

        //...

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapBlazorHub();
            endpoints.MapFallbackToPage("/_Host");
        });
    }
}

当我也在构建用于数据访问的API时，我认为身份验证等也应该在Web API部分中实现

如果您将Web API项目中的数据访问部分分开，则保护Web API部分（通过JWT身份验证等）将有助于防止意外的使用者调用您的API。

测试结果

,

我了解您的情况：Blazor Web应用程序（服务器端或客户端Blazor）+ ASP.NET Core Web API。

您将ASP.NET Core Identity与JWT令牌一起使用来存档您的需求。示例源代码：https://github.com/donhuvy/dotnet5_jwt

教程：https://viblo.asia/p/xac-thuc-jwt-dua-theo-role-trong-aspnet-core-web-api-5-4P856vA95Y3

视频：https://www.youtube.com/watch?v=gsx3xCiJJlY&list=PLFJQnCcZXWjuHP03Kgf46FrX5L2fRzDsx