ToB企服应用市场:ToB评测及商务社交产业平台

标题: 你真的了解token续期嘛? [打印本页]

作者: 丝    时间: 2024-4-7 04:58
标题: 你真的了解token续期嘛?
Spring Boot + Vue中的Token续签机制

在现代的全栈应用开发中,Spring Boot作为后端框架和Vue.js作为前端框架的组合非常流行。在这种架构中实现Token续签是保障应用安全的关键部分。本文旨在提供一个基于Spring Boot和Vue的长短Token续签示例。
1. Spring Boot后端

1.1 长Token的生成

在Spring Boot中,我们首先需要一个方法来生成JWT Token。这里我们使用jjwt库。
引入依赖

在pom.xml文件中加入以下依赖:
  1. <dependency>
  2.     <groupId>io.jsonwebtoken</groupId>
  3.     <artifactId>jjwt</artifactId>
  4.     <version>0.9.1</version>
  5. </dependency>
复制代码
生成Token

创建一个服务JwtTokenService来生成和解析Token。
  1. import io.jsonwebtoken.Jwts;
  2. import io.jsonwebtoken.SignatureAlgorithm;
  3. import java.util.Date;
  4. @Service
  5. public class JwtTokenService {
  6.     private String secretKey = "your_secret_key";
  7.     public String generateLongToken(String username) {
  8.         long expiration = 7 * 24 * 60 * 60 * 1000; // 7 days
  9.         return Jwts.builder()
  10.                 .setSubject(username)
  11.                 .setExpiration(new Date(System.currentTimeMillis() + expiration))
  12.                 .signWith(SignatureAlgorithm.HS256, secretKey)
  13.                 .compact();
  14.     }
  15.     // ... 其他方法 ...
  16. }
复制代码
1.2 短Token的生成

短Token的生成方式类似,只是过期时间较短。
  1. public String generateShortToken(String username) {
  2.     long expiration = 15 * 60 * 1000; // 15 minutes
  3.     return Jwts.builder()
  4.             .setSubject(username)
  5.             .setExpiration(new Date(System.currentTimeMillis() + expiration))
  6.             .signWith(SignatureAlgorithm.HS256, secretKey)
  7.             .compact();
  8. }
复制代码
1.3 Token续签

当用户进行操作时,可以根据需要续签Token。
  1. public String renewToken(String oldToken) {
  2.     // 解析旧Token获取用户名
  3.     String username = Jwts.parser()
  4.             .setSigningKey(secretKey)
  5.             .parseClaimsJws(oldToken)
  6.             .getBody()
  7.             .getSubject();
  8.     // 生成新的短Token
  9.     return generateShortToken(username);
  10. }
复制代码
2. Vue前端

在Vue应用中,我们需要确保每次发送请求时附加Token,并在需要时更新Token。
2.1 设置Axios拦截器

在Vue项目中,我们使用Axios来发送HTTP请求。通过设置拦截器,我们可以在每个请求中自动添加Token。
  1. import axios from 'axios';
  2. axios.interceptors.request.use(
  3.     config => {
  4.         const token = localStorage.getItem('token');
  5.         if (token) {
  6.             config.headers.Authorization = `Bearer ${token}`;
  7.         }
  8.         return config;
  9.     },
  10.     error => {
  11.         return Promise.reject(error);
  12.     }
  13. );
复制代码
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!




欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/) Powered by Discuz! X3.4