Spring Boot与Vue3集成JWT认证实践指南

1. 项目背景与技术选型

最近在重构一个后台管理系统，需要实现一套完整的用户认证体系。考虑到现代前后端分离架构的特点，最终选择了JWT（JSON Web Token）作为认证方案，配合Vue3前端和Spring Boot 3后端实现。这个组合在当前的Web开发中非常流行，但实际集成过程中发现不少细节问题需要特别注意。

为什么选择这个技术栈？首先，JWT的无状态特性非常适合RESTful API，避免了服务端存储session的开销。其次，Vue3的Composition API比Options API更灵活，配合TypeScript能大幅提升开发效率。后端选择MyBatis-Plus则是看中了它的强大CRUD能力和代码生成功能，可以节省大量重复工作。

提示：虽然JWT有很多优点，但在实际项目中要特别注意token过期时间和刷新机制的设计，否则会带来安全隐患。

2. 后端JWT实现细节

2.1 依赖配置与基础类创建

首先需要在pom.xml中添加必要的依赖：

xml复制<dependency>
    <groupId>io.jsonwebtoken</groupId>
    <artifactId>jjwt-api</artifactId>
    <version>0.11.5</version>
</dependency>
<dependency>
    <groupId>io.jsonwebtoken</groupId>
    <artifactId>jjwt-impl</artifactId>
    <version>0.11.5</version>
    <scope>runtime</scope>
</dependency>
<dependency>
    <groupId>io.jsonwebtoken</groupId>
    <artifactId>jjwt-jackson</artifactId>
    <version>0.11.5</version>
    <scope>runtime</scope>
</dependency>

然后创建JWT工具类，封装token的生成和解析方法：

java复制public class JwtUtil {
    private static final String SECRET_KEY = "your-256-bit-secret";
    private static final long EXPIRATION = 86400000; // 24小时
    
    public static String generateToken(UserDetails userDetails) {
        return Jwts.builder()
                .setSubject(userDetails.getUsername())
                .setIssuedAt(new Date())
                .setExpiration(new Date(System.currentTimeMillis() + EXPIRATION))
                .signWith(Keys.hmacShaKeyFor(SECRET_KEY.getBytes()), SignatureAlgorithm.HS256)
                .compact();
    }
    
    public static String extractUsername(String token) {
        return Jwts.parserBuilder()
                .setSigningKey(SECRET_KEY.getBytes())
                .build()
                .parseClaimsJws(token)
                .getBody()
                .getSubject();
    }
}

2.2 Spring Security配置

配置Spring Security来保护API端点：

java复制@Configuration
@EnableWebSecurity
public class SecurityConfig {
    
    @Bean
    public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
        http
            .csrf().disable()
            .authorizeRequests()
                .antMatchers("/api/auth/**").permitAll()
                .anyRequest().authenticated()
            .and()
            .sessionManagement().sessionCreat