写一个blazor登录项目,用JWT的方式存储有用户详情的token,登录成功后,在主页展示用户详情框架是.net core
时间: 2024-10-05 13:02:27 浏览: 40
JWT 实现登录认证 + Token 自动续期方案,这才是正确的使用姿势!
创建一个基于.NET Core和Blazor的登录项目,使用JWT来存储包含用户详细信息的token,可以按照以下步骤进行:
1. **设置环境**:
- 确保已经安装了Visual Studio 2022或更高版本,以及.NET Core SDK。
2. **创建新项目**:
- 打开VS,选择“创建新项目”,在模板中选择“ASP.NET Core” -> “单文件Web 应用程序(.NET Core)”。
3. **添加依赖项**:
- 在`Startup.cs`文件的`ConfigureServices`方法中,添加对`Microsoft.AspNetCore.Authentication.JwtBearer` 和 `Microsoft.IdentityModel.Tokens` 的引用,以支持JWT。
```csharp
services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
.AddJwtBearer(options =>
{
options.TokenValidationParameters = new TokenValidationParameters
{
ValidateIssuer = true,
ValidateAudience = true,
ValidateLifetime = true,
ValidateIssuerSigningKey = true,
IssuerSigningKey = SecurityAlgorithms.RsaSignaturePadding,
// 需要替换为你自己的密钥
ValidIssuer = "yourdomain.com",
ValidAudience = "yourapi.com"
};
});
```
4. **创建登录页面**:
- 创建一个新的 Razor 页面,比如`Login.razor`,实现表单输入和提交逻辑,使用`AuthenticationStateProvider`来验证用户凭证。
5. **登入选项逻辑**:
- 用户登录成功后,从数据库获取用户详情,将其序列化为JWT并返回给客户端。
```csharp
public async Task<IActionResult> Login(LoginViewModel model)
{
if (ModelState.IsValid)
{
// 登录验证逻辑...
var user = await UserService.Authenticate(model.Username, model.Password);
if (user != null)
{
var claimsPrincipal = new ClaimsPrincipal(new ClaimsIdentity(
new Claim[]
{
new Claim(ClaimTypes.NameIdentifier, user.Id),
new Claim(ClaimTypes.Name, user.DisplayName),
// 添加其他需要的用户详情声明
},
JwtBearerDefaults.AuthenticationScheme));
var handler = new JwtSecurityTokenHandler();
var token = handler.CreateToken(
new SecurityTokenDescriptor
{
Subject = claimsPrincipal,
Expires = DateTime.UtcNow.AddDays(7), // 设置有效期
SigningCredentials = new SigningCredentials(
SecurityKey.FromJsonWebKey(
JsonConvert.SerializeObject(apiKey)),
SecurityAlgorithms.RsaSignPkcs1)
});
return Ok(new { access_token = token.RawData, expires_in = (int)(token.ValidTo.Value - DateTime.UtcNow).TotalSeconds });
}
}
return Challenge();
}
```
6. **主页显示用户信息**:
- 主页`Index.razor`中,你需要在每个请求开始前检查是否有有效的JWT。如果存在,解码并提取用户信息。
```csharp
@inject Microsoft.AspNetCore.Authentication.AuthenticationStateProvider AuthenticationState
...
@if (AuthenticationState.IsSignedIn(User))
{
string userId = User.FindFirstValue(ClaimTypes.NameIdentifier);
string userName = User.FindFirstValue(ClaimTypes.Name);
// 显示用户名或其他详细信息
}
```
阅读全文