Vue项目中配置全局axios信息。并使用axios发起请求携带token信息，后端Filter配置拦截器并处理请求头token信息

首先在Vue项目中配置全局axios信息，在src下新建axios文件夹，里边建一个index.js文件

 我的jwt信息存储在sessionStorage，直接从sessionStorage存储里边去取，配置axios信息并导出：

import axios from "axios";
var config={
    //配置请求地址
    baseURL:"http://localhost:8081/",
    //配置超时信息
    timeout:10000,
}
//创建axios实例
var instance = axios.create(config);
//配置拦截器信息
instance.interceptors.request.use((config)=>{
    //获取token信息
    const token=JSON.parse(sessionStorage.getItem('token')).msg 
    //设置请求头token信息
    if(token){
        config.headers.token = token;
    }
    return config
},(error)=>{
    return Promise.reject(error);
})
instance.interceptors.response.use((response)=>{
    //处理响应结果response
    console.log(response);
})
export default instance

在main.js文件里边配置全局使用：

 在项目中使用配置好的axios，使用this.$axios来调用，全局配置好的信息不用再去配置，如果要重新配置，可以导入没配置的axios去使用，使用方式：导入源axios，正常使用：

这样请求时就会在请求头上加上token信息 

后端SpringBoot项目配置Filter信息：

新建一个类去实现Filter接口并重写里边的三个方法（doFilter方法必须实现，其他两个可以不用，有默认实现），注意：SpringBoot3版本以上的导入的是jakarta.servlet下的Filter

配置拦截器：

1：在类名上添加注解@WebFilter(“  ”),常用参数说明：

/*:通配符，即拦截所有请求

指定拦截请求路径(如拦截data)：/data

指定拦截目录，拦截data开头的所有请求：/data/*

2：在SpringBoot启动类上添加注解@ServletComponentScan，扫描Servlet包

具体拦截方式：

@Override
	public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
			log.info("拦截到了数据");
			//请求信息
		HttpServletRequest request=(HttpServletRequest)  servletRequest;
		//响应信息
		HttpServletResponse response=(HttpServletResponse) servletResponse;
		//获取请求路径
		String url = request.getRequestURI();
		log.info("请求路径：{}",url);
		//判断请求路径是否需要拦截
		if (url.contains("login")||url.contains("register")||url.contains("returnpsd")){
			log.info("可以放行");
			filterChain.doFilter(servletRequest,servletResponse);
			return;
		}

		//执行到这里，说明需要拦截请求，获取请求头中的jwt信息进行校验
		String token = request.getHeader("token");
			log.info("token-->:{}",token);

		//判断jwt信息是否有长度
			if (!StringUtils.hasLength(token)){
				Result notLogin = Result.error("请重新登录");
				//转为json格式
				String jsonString = JSONObject.toJSONString(notLogin);
				//响应信息给前端
				response.getWriter().write(jsonString);
				return;
			}

若jwt有效则放行去访问资源

生成jwt令牌可以去看我之前写的一篇文章：使用Hutool包下的JWTUtil工具类来生成和解析JWT令牌-CSDN博客文章浏览阅读567次。上面的jwt.setkey(key.getBytes()).verify()方法通过传入令牌的签名秘钥并对给定的令牌的签名秘钥进行一致性校验。最近在做jwt令牌校验的时候发现了hutool包也对jwt做了相应的工具类 ，昨天摸索了一下午也是简单使用了一下。在生成JWt令牌时这里我没有指定签名算法，默认使用的HS256签名算法。https://blog.csdn.net/2301_78755150/article/details/140753623