【项目实战】一、Spring boot整合JWT、Vue案例展示用户鉴权(中)

简介: 【项目实战】一、Spring boot整合JWT、Vue案例展示用户鉴权(中)

2.4、添加controller

import com.alibaba.nacos.shaded.com.google.gson.Gson;
import com.xxxx.authorityservice.config.JwtConfig;
import com.xxxx.commonapi.dto.ResultDTO;
import com.xxxx.commonapi.dto.TokenDTO;
import com.xxxx.commonapi.entity.UserInfo;
import com.xxxx.commonapi.http.HttpResultGenerator;
import com.xxxx.commonapi.http.HttpStatusEnum;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
import javax.servlet.http.HttpServletRequest;
import java.util.HashMap;
import java.util.Map;
@RestController
@RequestMapping("/auth")
public class AuthController {
    @Autowired
    private JwtConfig jwtConfig;
    /**
     * 登录
     */
    @PostMapping("/login")
    public ResultDTO login(@RequestBody UserInfo userInfo){
        String token = jwtConfig.createToken(new Gson().toJson(userInfo));
        Map<String, String> map = new HashMap();
        map.put("token",token);
        return HttpResultGenerator.success(HttpStatusEnum.SUCCESS,map);
    }
    /**
     * token是否正确
     */
    @PostMapping("/isRight")
    public ResultDTO isRight(){
        return HttpResultGenerator.success(HttpStatusEnum.SUCCESS,"成功!");
    }
    /**
     * token解密
     */
    @PostMapping("/getUserMessageByToken")
    public ResultDTO getUserMessageByToken(HttpServletRequest request){
        String name = jwtConfig.getUserNameFromToken(request.getHeader("token"));
        return HttpResultGenerator.success(HttpStatusEnum.SUCCESS,name);
    }
    /**
     * token是否过期
     */
    @PostMapping("/isTokenExpiration")
    public Boolean isTokenExpiration(@RequestBody TokenDTO tokenDTO){
        return this.jwtConfig.isTokenExpired(this.jwtConfig.getExpirationDateFromToken(tokenDTO.getToken()));
    }
}

3、gateway工程改造

3.1、修改配置文件

这里是在nacos配置中心写的配置文件

添加下图红框内容

- id: auth-service_routh   #路由 id,没有固定规则,但唯一,建议与服务名对应
            uri: lb://authority-service           #匹配后提供服务的路由地址
            predicates:
              #以下是断言条件,必auth选全部符合条件
              - Path=/auth/**               #断言,路径匹配 注意:Path 中 P 为大写
              - Method=GET,POST #只能时 GET,POST 请求时,才能访问

3.2、新建AuthService接口

import com.xxxx.commonapi.dto.TokenDTO;
import org.springframework.cloud.openfeign.FeignClient;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
/**
 * @author kelvin
 * @Date 2023/6/8 - 10:09
 */
@FeignClient(value = "authority-service")
public interface AuthService {
    @PostMapping("/auth/isTokenExpiration")
    public Boolean validateToken(@RequestBody TokenDTO tokenDTO);
}

注意事项:

接口中的value值必须与服务名完全相同!
方法中的参数必须与authority-service服务的/auth/isTokenExpiration接口的参数对应上,最好使用RequestBody接收,否则参数过长可能导致失败!

3.3、新建filter目录,新建DrfGlobalFilter全局拦截器

import com.alibaba.nacos.api.utils.StringUtils;
import com.alibaba.nacos.shaded.com.google.gson.Gson;
import com.xxxx.commonapi.dto.TokenDTO;
import com.xxxx.commonapi.http.HttpResultGenerator;
import com.xxxx.commonapi.http.HttpStatusEnum;
import com.xxxx.gatewayservice.service.AuthService;
import lombok.SneakyThrows;
import org.springframework.cloud.gateway.filter.GatewayFilterChain;
import org.springframework.cloud.gateway.filter.GlobalFilter;
import org.springframework.core.Ordered;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.server.reactive.ServerHttpRequest;
import org.springframework.http.server.reactive.ServerHttpResponse;
import org.springframework.stereotype.Component;
import org.springframework.web.server.ServerWebExchange;
import reactor.core.publisher.Mono;
import javax.servlet.http.HttpServletResponse;
import java.util.concurrent.ExecutorService;
import java.util.concurrent.Executors;
@Component
public class DrfGlobalFilter implements GlobalFilter, Ordered {
    private final AuthService authService;
    private ExecutorService executorService;
    public DrfGlobalFilter(AuthService authService) {
        this.authService = authService;
        this.executorService = Executors.newFixedThreadPool(5);
    }
    @Bean
    @ConditionalOnMissingBean
    public HttpMessageConverters messageConverters(ObjectProvider<HttpMessageConverter<?>> converters) {
        return new HttpMessageConverters(converters.orderedStream().collect(Collectors.toList()));
    }
    @SneakyThrows
    @Override
    public Mono<Void> filter(ServerWebExchange exchange, GatewayFilterChain chain) {
        ServerHttpRequest request = exchange.getRequest();
        //如果登录请求,不用验证token
        String path = request.getURI().getPath();
        if(!path.contains("login")){
            HttpHeaders headers = request.getHeaders();
            String token = headers.getFirst("token");
            //token为空表示没有登录,否则已经登录
            if(StringUtils.isBlank(token)){
                ServerHttpResponse response = exchange.getResponse();
                response.setStatusCode(HttpStatus.UNAUTHORIZED);
                return response.setComplete();
            }else{
                TokenDTO tokenDTO = new TokenDTO();
                tokenDTO.setToken(token);
                Boolean f = authService.validateToken(tokenDTO);
                if(f){
                    ServerHttpResponse response = exchange.getResponse();
                    response.setStatusCode(HttpStatus.UNAUTHORIZED);
                    HttpServletResponse response1 = (HttpServletResponse) response;
                    response1.getWriter().write(new Gson().toJson(HttpResultGenerator.fail(HttpStatusEnum.REQUEST_METHOD_SUPPORT_ERROR)));
                    return response.setComplete();
                }
            }
        }
        return chain.filter(exchange);
    }
    @Override
    public int getOrder() {
        return 0;
    }
}

4、Postman测试

5、创建vue3项目,与后台JWT鉴权交互

5.1、进入cmd界面,进入到存放前端项目的文件夹

5.2、安装vue脚手架vue-cli3

cnpm install @vue/cli -g 注:安装过的可以不用再安装

安装后查看vue的版本

vue -V

5.3、创建Vue项目,项目名称不支持特殊字符也不支持驼峰命名

vue create 项目名称

选择vue3

5.4、vue项目引入Element-Plus

打开终端进入项目文件夹

5.4.1、安装element-plus

cnpm install element-plus --save

安装后在package.json中可以看到element-plus的版本

5.4.2、在main.js中导入element-plus并使用

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
app.use(ElementPlus)

目录
相关文章
|
前端开发 Java 关系型数据库
基于Java+Springboot+Vue开发的鲜花商城管理系统源码+运行
基于Java+Springboot+Vue开发的鲜花商城管理系统(前后端分离),这是一项为大学生课程设计作业而开发的项目。该系统旨在帮助大学生学习并掌握Java编程技能,同时锻炼他们的项目设计与开发能力。通过学习基于Java的鲜花商城管理系统项目,大学生可以在实践中学习和提升自己的能力,为以后的职业发展打下坚实基础。技术学习共同进步
935 7
|
JavaScript 前端开发 Java
制造业ERP源码,工厂ERP管理系统,前端框架:Vue,后端框架:SpringBoot
这是一套基于SpringBoot+Vue技术栈开发的ERP企业管理系统,采用Java语言与vscode工具。系统涵盖采购/销售、出入库、生产、品质管理等功能,整合客户与供应商数据,支持在线协同和业务全流程管控。同时提供主数据管理、权限控制、工作流审批、报表自定义及打印、在线报表开发和自定义表单功能,助力企业实现高效自动化管理,并通过UniAPP实现移动端支持,满足多场景应用需求。
1360 1
|
前端开发 安全 Java
基于springboot+vue开发的会议预约管理系统
一个完整的会议预约管理系统,包含前端用户界面、管理后台和后端API服务。 ### 后端 - **框架**: Spring Boot 2.7.18 - **数据库**: MySQL 5.6+ - **ORM**: MyBatis Plus 3.5.3.1 - **安全**: Spring Security + JWT - **Java版本**: Java 11 ### 前端 - **框架**: Vue 3.3.4 - **UI组件**: Element Plus 2.3.8 - **构建工具**: Vite 4.4.5 - **状态管理**: Pinia 2.1.6 - **HTTP客户端
1607 4
基于springboot+vue开发的会议预约管理系统
|
前端开发 JavaScript Java
基于springboot+vue开发的校园食堂评价系统【源码+sql+可运行】【50809】
本系统基于SpringBoot与Vue3开发,实现校园食堂评价功能。前台支持用户注册登录、食堂浏览、菜品查看及评价发布;后台提供食堂、菜品与评价管理模块,支持权限控制与数据维护。技术栈涵盖SpringBoot、MyBatisPlus、Vue3、ElementUI等,适配响应式布局,提供完整源码与数据库脚本,可直接运行部署。
669 6
基于springboot+vue开发的校园食堂评价系统【源码+sql+可运行】【50809】
|
供应链 JavaScript BI
ERP系统源码,基于SpringBoot+Vue+ElementUI+UniAPP开发
这是一款专为小微企业打造的 SaaS ERP 管理系统,基于 SpringBoot+Vue+ElementUI+UniAPP 技术栈开发,帮助企业轻松上云。系统覆盖进销存、采购、销售、生产、财务、品质、OA 办公及 CRM 等核心功能,业务流程清晰且操作简便。支持二次开发与商用,提供自定义界面、审批流配置及灵活报表设计,助力企业高效管理与数字化转型。
1039 2
ERP系统源码,基于SpringBoot+Vue+ElementUI+UniAPP开发
|
监控 数据可视化 JavaScript
springboot + vue的MES系统生产计划管理源码
MES系统(制造执行系统)的生产计划管理功能是其核心模块之一,涵盖生产计划制定与优化、调度排程、进度监控反馈、资源管理调配及可视化报告五大方面。系统基于SpringBoot + Vue-Element-Plus-Admin技术栈开发,支持多端应用(App、小程序、H5、后台)。通过实时数据采集与分析,MES助力企业优化生产流程,适用于现代化智能制造场景。
758 1
|
JSON 安全 Java
什么是JWT?如何使用Spring Boot Security实现它?
什么是JWT?如何使用Spring Boot Security实现它?
2687 5
|
SQL Java 测试技术
在Spring boot中 使用JWT和过滤器实现登录认证
在Spring boot中 使用JWT和过滤器实现登录认证
1306 0
|
JSON 安全 Java
使用Spring Boot和JWT实现用户认证
使用Spring Boot和JWT实现用户认证