asp.net core mvc前端通过检查JWT判断用户的角色

Question

前台页面想通过JWT中的角色,对不同按钮或div进行权限设置，如禁用，请教一个靠谱的方法

Answer 1

以下回复参考：皆我百晓生、券券喵儿等免费微信小程序作答:

要实现ASP.NET Core MVC前端通过JWT中的角色对不同按钮或Div进行权限控制，可以采用以下步骤：

1. 创建一个新的ASP.NET Core项目。

2. 在Startup.cs中添加Microsoft.AspNetCore.Authentication.JwtBearer和Microsoft.EntityFrameworkCore.SqlServer依赖项。

3. 配置JWT令牌在应用程序启动时创建。这可以通过ConfigureServices方法完成：

services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
    .AddJwtBearer(options =>
    {
        options.TokenValidationParameters = new TokenValidationParameters()
        {
            ValidateIssuerSigningKey = true,
            IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes("your_secret_key")),
            ValidateIssuer = false,
            ValidateAudience = false
        };
    });

1. 在控制器中处理JWT令牌。首先，在OnAuthorization方法中验证令牌是否有效，然后根据roles字段（包含所有已授权角色）决定显示哪些资源。

2. 为每个请求处理JWT令牌并获取角色信息。可以使用HttpContext对象来访问这些信息：

public async Task<IActionResult> OnGetAsync(string id)
{
    var user = await _userManager.GetUserAsync(User);
    if (user == null) return Unauthorized();

    // 获取用户的所有权限
    var roles = await _roleManager.GetRolesForUser(user.Id);

    // 根据角色决定显示哪些资源
    if (roles.Contains("Admin"))
    {
        return Ok(new { message = "Admin access granted" });
    }
    else
    {
        return Unauthorized();
    }
}

1. 如果需要进一步控制特定按钮或div的权限，可以在路由配置中为它们绑定不同的URL模式，并在视图中提供相应的逻辑。例如，将<a>标签绑定到/admin路径，并在视图中检查当前用户是否具有管理员权限。

2. 在视图中使用@await Html.PartialAsync("/Views/Shared/Permission.cshtml")来加载权限部分。这会根据用户的权限展示相应的内容。

这是一个基本的示例，实际应用可能需要更复杂的逻辑以适应各种情况。此外，确保遵循最佳实践，例如正确存储敏感数据（如密钥），并且不要在生产环境中公开任何API端点。

注意：上述代码片段仅用于演示目的，实际部署时应替换为适当的加密算法和密钥。