如何在Blazor Server应用中通过自定义页面添加带角色的用户？

嘿Andrew，刚上手Blazor Server就能自己改默认登录逻辑，已经很棒了！我一步步给你梳理怎么在AddUsersPage实现手动添加用户+分配角色的功能，都是新手友好的步骤：

首先，咱们需要用到ASP.NET Identity里的UserManager<IdentityUser>和RoleManager<IdentityRole>来处理用户和角色操作。在你的AddUsersPage.razor顶部注入这两个服务：

@inject UserManager<IdentityUser> UserManager
@inject RoleManager<IdentityRole> RoleManager
@inject NavigationManager NavigationManager

（如果你用的是自定义用户类，把IdentityUser换成你自己的类就行，比如AppUser）

接下来做一个简单的表单，让管理员输入用户信息、选择角色。用Blazor的EditForm来做表单验证：

<h3>添加新用户</h3>

<EditForm Model="@newUser" OnValidSubmit="@HandleAddUser">
    <DataAnnotationsValidator />
    <ValidationSummary />

    <div class="form-group">
        <label>用户名:</label>
        <InputText @bind-Value="newUser.UserName" class="form-control" />
    </div>

    <div class="form-group">
        <label>邮箱:</label>
        <InputText @bind-Value="newUser.Email" class="form-control" />
    </div>

    <div class="form-group">
        <label>密码:</label>
        <InputText type="password" @bind-Value="password" class="form-control" />
        <small class="text-muted">密码需要符合你的身份验证规则（比如长度、包含特殊字符等）</small>
    </div>

    <div class="form-group">
        <label>分配角色:</label>
        <InputSelect @bind-Value="selectedRole" class="form-control">
            <option value="">请选择角色</option>
            @foreach (var role in availableRoles)
            {
                <option value="@role.Name">@role.Name</option>
            }
        </InputSelect>
    </div>

    <button type="submit" class="btn btn-primary mt-3">添加用户</button>
</EditForm>

@if (!string.IsNullOrEmpty(message))
{
    <div class="alert @alertClass mt-3">@message</div>
}

在AddUsersPage.razor的@code块（或者代码分离的AddUsersPage.razor.cs文件）里写核心逻辑，先定义需要的变量和方法：

@code {
    private IdentityUser newUser = new IdentityUser();
    private string password = string.Empty;
    private string selectedRole = string.Empty;
    private List<IdentityRole> availableRoles = new List<IdentityRole>();
    private string message = string.Empty;
    private string alertClass = string.Empty;

    protected override async Task OnInitializedAsync()
    {
        // 加载数据库中已有的角色（Administrator和User）
        availableRoles = (await RoleManager.Roles.ToListAsync());
    }

    private async Task HandleAddUser()
    {
        if (string.IsNullOrEmpty(selectedRole))
        {
            message = "请为用户分配一个角色！";
            alertClass = "alert-danger";
            return;
        }

        // 创建用户
        var createResult = await UserManager.CreateAsync(newUser, password);
        if (createResult.Succeeded)
        {
            // 给用户分配选中的角色
            var roleResult = await UserManager.AddToRoleAsync(newUser, selectedRole);
            if (roleResult.Succeeded)
            {
                message = $"用户 {newUser.UserName} 已成功创建并分配 {selectedRole} 角色！";
                alertClass = "alert-success";
                // 重置表单
                newUser = new IdentityUser();
                password = string.Empty;
                selectedRole = string.Empty;
            }
            else
            {
                message = $"分配角色失败: {string.Join(", ", roleResult.Errors.Select(e => e.Description))}";
                alertClass = "alert-danger";
                // 角色分配失败，删除刚创建的用户
                await UserManager.DeleteAsync(newUser);
            }
        }
        else
        {
            message = $"创建用户失败: {string.Join(", ", createResult.Errors.Select(e => e.Description))}";
            alertClass = "alert-danger";
        }
    }
}

别忘啦！这个页面只能让管理员操作，普通用户不能进来。你有两种简单的实现方式：

• 方式一：在代码分离的AddUsersPage.razor.cs类上添加特性：

[Authorize(Roles = "Administrator")]
public partial class AddUsersPage : ComponentBase
{
    // 类逻辑...
}

• 方式二：在razor页面里用AuthorizeView包裹内容：

<AuthorizeView Roles="Administrator">
    <Authorized>
        <!-- 这里放之前的表单内容 -->
    </Authorized>
    <NotAuthorized>
        <div class="alert alert-danger">你没有权限访问此页面！</div>
    </NotAuthorized>
</AuthorizeView>

• 如果你用的是自定义用户表，记得把所有IdentityUser替换成你的自定义用户类（比如AppUser），同时确保UserManager注入的是对应的类型
• 密码规则可以在Program.cs里配置，比如调整复杂度要求：

builder.Services.AddIdentity<IdentityUser, IdentityRole>(options =>
{
    options.Password.RequireDigit = true;
    options.Password.RequireLowercase = true;
    options.Password.RequiredLength = 6;
    // 其他规则...
})
.AddEntityFrameworkStores<YourDbContext>();

• 测试时一定要用管理员账号登录，不然会被权限拦截哦！

内容的提问来源于stack exchange，提问作者Andrew Chang