identityserver4 - 如何在 Blazor 中自定义 IdentityServer View ？

Question

我的项目使用 Blazor Web 程序集和 Asp.Net Core 托管，使用个人用户帐户(身份验证)。但我有两个问题。首先我想自定义注册并登录View(涉及到identity server 4)，但是找不到view。在服务器项目(blazor server)的_LoginPartial.cshtml View 中，我们可以看到很多页面:asp-area="Identity"asp-page="/Account/Manage/Index" 和asp-area="Identity"asp-page="/Account/Logout" , asp-area="Identity"asp-page="/Account/Register" 等等......但身份文件夹是空的!同样在 Blazor 客户端中，我们有 LoginDisplay.razor 页面:

<NotAuthorized>
    <a href="authentication/register">Register</a>
    <a href="authentication/login">Log in</a>
</NotAuthorized>

在 Pages 文件夹中，我们有 Authentication.razor 组件:

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
<RemoteAuthenticatorView Action="@Action" />

@code{
    [Parameter] public string Action { get; set; }
}

Authentication.razor 间接调用 IdentityServer4 的组件。

如何找到身份服务器 4 View 并进行更改？

第二个问题是当我想在启动文件 blazor 服务器中使用自定义身份模型时。

默认代码是:

services.AddDefaultIdentity<ApplicationUser>(options => options.SignIn.RequireConfirmedAccount = true)
                .AddEntityFrameworkStores<ApplicationDbContext>();

当我更改为:

services.AddIdentity<ApplicationUser,Role>(options => options.SignIn.RequireConfirmedAccount = true)
                .AddEntityFrameworkStores<ApplicationDbContext>();

当我运行项目并单击登录或注册按钮 (Authentication.razor) 时调用 IdentityServer (ex:https://localhost:5001/Identity/Account/Register?returnUrl= %2Fauthentication%2Flogin)，给我一个错误:

Sorry, there's nothing at this address.

我不知道为什么。

Answer 1

我只知道如何自定义“您已退出”、“正在检查登录状态”等文本。

根据 the doc ，您可以通过设置 RemoteAuthenticatorView 组件的参数将渲染片段更改为您想要的任何内容。

您可以自定义 9 种不同的渲染片段:

1. CompletingLoggingIn
2. CompletingLogOut
3. 登录
4. 登录失败
5. 注销
6. 注销失败
7. 注销成功
8. 注册
9. 用户资料

例如，如果您想在登录时更改文本，只需执行以下操作:

// BlazorApp.Client.Pages.Authentication.razor

@page "/authentication/{Action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action" >
    <LoggingIn>
        I'm Logging in!!          // here
        <img src="/loading.gif /> // and more!
    </LoggingIn>
</RemoteAuthenticatorView>