Blazor WebAssembly基于角色授权问题：Keycloak JWT角色无法识别

我在Blazor WebAssembly应用与Keycloak集成时遇到角色授权问题：使用带有Roles属性的<AuthorizeView>标签时，组件无法正确识别角色，始终显示<NotAuthorized>区域内容。

已配置Keycloak将角色作为一级对象放入JWT中，经验证JWT格式如下：

{
  "...": "...",
  "role": "role1",
  "role": "role2",
  "role": "role3",
  "...": "..."
}

测试代码如下：

<AuthorizeView Context="QuestionsManagement" Roles="Recruiter">
   <Authorized>
      <li class="nav-item px-3">
         <NavLink class="nav-link" href="/selection-processes" Match="NavLinkMatch.All">
            <span class="oi oi-book" aria-hidden="true"></span> Manage Questions
         </NavLink>
      </li>
   </Authorized>
   <NotAuthorized>
      <li class="nav-item px-3">
         <NavLink class="nav-link" href="/selection-processes" Match="NavLinkMatch.All">
            <span class="oi oi-book" aria-hidden="true"></span> Test not authorized
         </NavLink>
      </li>
   </NotAuthorized>
</AuthorizeView>

请问需要关注哪些配置要点？可能存在哪些缺失或错误配置？

核心问题排查与解决要点 #

1. JWT角色格式错误 #

你提供的JWT中role是重复键，JSON不允许重复键，实际生成的JWT里角色必须是数组格式，正确结构应为：

{
  "...": "...",
  "role": ["role1", "role2", "role3"],
  "...": "..."
}

修复Keycloak配置：

• 进入对应客户端的Mappers页签，添加"User Client Role"类型的映射器
• 设置Token Claim Name为role，Claim JSON Type选String，开启"Multivalued"（确保多角色生成数组）

2. Blazor未正确映射角色声明 #

Blazor默认识别的角色声明类型是http://schemas.microsoft.com/ws/2008/06/identity/claims/role，而你的JWT用的是role字段，需配置Claims映射：

在Program.cs中指定角色声明字段：

builder.Services.AddOidcAuthentication(options =>
{
    // 保留原有OIDC配置
    options.UserOptions.RoleClaim = "role"; // 告诉Blazor用JWT中的"role"字段作为角色声明
});

或自定义Claims转换器（更灵活）：

builder.Services.AddScoped<IClaimsTransformation, RoleClaimsTransformation>();

public class RoleClaimsTransformation : IClaimsTransformation
{
    public Task<ClaimsPrincipal> TransformAsync(ClaimsPrincipal principal)
    {
        var identity = (ClaimsIdentity)principal.Identity;
        var roleClaims = identity.FindAll("role");
        
        foreach (var claim in roleClaims)
        {
            identity.AddClaim(new Claim(ClaimTypes.Role, claim.Value));
        }
        
        return Task.FromResult(principal);
    }
}

3. 角色名称大小写不匹配 #

检查Keycloak中配置的角色名称（比如Recruiter）和Blazor代码中Roles="Recruiter"的大小写是否完全一致——角色匹配是严格区分大小写的。

4. OIDC配置未请求角色权限范围 #

确保在OIDC配置中添加角色相关的scope，否则Keycloak不会返回角色信息：

builder.Services.AddOidcAuthentication(options =>
{
    options.ProviderOptions.Scope.Add("roles"); // 添加角色权限范围
    // 其他OIDC配置...
});

5. 验证ClaimsPrincipal中的角色 #

在Blazor组件中添加调试代码，确认当前用户的Claims是否包含正确的角色：

@inject AuthenticationStateProvider AuthStateProvider

@code {
    protected override async Task OnInitializedAsync()
    {
        var authState = await AuthStateProvider.GetAuthenticationStateAsync();
        var user = authState.User;
        
        // 控制台输出所有声明，检查是否有角色相关条目
        foreach (var claim in user.Claims)
        {
            Console.WriteLine($"Claim Type: {claim.Type}, Value: {claim.Value}");
        }
    }
}

如果输出中没有http://schemas.microsoft.com/ws/2008/06/identity/claims/role类型的声明，说明Claims转换逻辑未生效。

内容的提问来源于stack exchange，提问作者Maxi Jabase