h5网站欣赏,最新一轮阳性症状,办公管理系统,公司注册步骤流程目录
1. JWT 登录并存储到 localStorage
2. 读取 JWT
3. 删除 JWT#xff08;用户退出#xff09;
4. 修改 JWT
5. 处理 JWT 过期
总结 在使用 JWT#xff08;JSON Web Token#xff09;进行身份验证时#xff0c;除了生成和存储 JWT#xff0c;还需要处理读取、删…目录
1. JWT 登录并存储到 localStorage
2. 读取 JWT
3. 删除 JWT用户退出
4. 修改 JWT
5. 处理 JWT 过期
总结 在使用 JWTJSON Web Token进行身份验证时除了生成和存储 JWT还需要处理读取、删除和修改 JWT 的操作以支持用户的登录、退出和令牌更新功能。以下是完善的示例代码和实现步骤。
1. JWT 登录并存储到 localStorage
首先生成 JWT 并将其存储到浏览器的 localStorage 中。
async Task login()
{if (AtsDAO.userLogin(userName, password)){// 假设 JwtHelper.GenerateToken 会根据用户名生成 JWTvar token JwtHelper.GenerateToken(userName); // 将 token 存储到 localStorageawait js.InvokeVoidAsync(localStorage.setItem, authToken, token);// 导航到成功页面NavigationManager.NavigateTo(/?tokenloginsuccess, true);}else{await alert(用户名或密码错误);}
}
2. 读取 JWT
要从 localStorage 中读取 JWT可以使用 JavaScript 通过 IJSRuntime 调用来实现。
async Taskstring GetAuthToken()
{// 从 localStorage 读取 authTokenreturn await js.InvokeAsyncstring(localStorage.getItem, authToken);
}
这段代码可以在 API 请求中使用将令牌附加到 Authorization header 中进行身份验证。例如
async TaskHttpResponseMessage MakeApiRequest()
{var token await GetAuthToken();if (!string.IsNullOrEmpty(token)){var client new HttpClient();client.DefaultRequestHeaders.Authorization new System.Net.Http.Headers.AuthenticationHeaderValue(Bearer, token);return await client.GetAsync(https://your-api-endpoint);}return null;
}
3. 删除 JWT用户退出
当用户退出时可以通过移除 localStorage 中的 authToken 来销毁 JWT
async Task Logout()
{// 从 localStorage 移除 authTokenawait js.InvokeVoidAsync(localStorage.removeItem, authToken);// 导航到登录页面或主页NavigationManager.NavigateTo(/login, true);
}
4. 修改 JWT
在某些情况下你可能需要更新 JWT例如令牌过期后。可以通过以下方式修改 localStorage 中的 authToken
async Task UpdateAuthToken(string newToken)
{// 更新 localStorage 中的 authTokenawait js.InvokeVoidAsync(localStorage.setItem, authToken, newToken);
}
5. 处理 JWT 过期
为了处理 JWT 过期问题你可以在前端添加检查逻辑解析令牌并验证其是否过期。可以使用 JavaScript 解析 JWT 并检查其 exp 字段过期时间
function isTokenExpired(token) {const payload JSON.parse(atob(token.split(.)[1]));const exp payload.exp * 1000; // exp 是秒需要转换为毫秒return Date.now() exp;
}
在 Blazor 中调用这个 JavaScript 函数
async Taskbool IsAuthTokenExpired()
{var token await GetAuthToken();return await js.InvokeAsyncbool(isTokenExpired, token);
}
总结
以上代码展示了如何通过 JWT 实现用户登录、读取、修改和删除令牌的功能。通过将令牌存储在 localStorage 或 sessionStorage 中可以实现无状态的用户认证并在每次请求中附加令牌进行身份验证。