关于axios集成sa-token的请求头token问题

使用sa-token的方法进行登录后，发现使用@SaCheckLogin注解的方法调用时会显示无有效token，根据官方文档的指示：前后端分离 (sa-token.cc)，在前端往后端发请求时需要自己手动往header加入token，官方文档演示的是小程序的方案，我使用的是vue3的axios，上网查找良久才解决，步骤如下：

首先是SpringBoot的application.yaml中关于sa-token的配置需要有：

  # token名称 (同时也是cookie名称)  这里官方文档的快速入门中使用的是satoken
  token-name: Authorization
  # token前缀 在前端代码中需要加入该前缀，具体可看后文
  token-prefix: Bearer
  # 是否从header中读取token
  is-read-header: true

在后端使用sa-token的login方法登录后，将生成的token发送给前端

if (userId != null) {
            StpUtil.login(userId);
            String token = StpUtil.getTokenValue();
            return new R(true, "登录成功",token);
        }

前端接收并存入localStorage中

let token = res.data
localStorage.setItem('token',token)

在vue的axios的配置文件request.js中，加入拦截器：

// 添加请求拦截器 instance是你的axios实例名称
instance.interceptors.request.use((config) => {
//从localStorage拿出token
    const token = localStorage.getItem('token');
//这里加入了Bearer 前缀 token名字为Authorization 
    config.headers.Authorization = `Bearer ${token}`;
    return config;
  });

再次登录后发送请求后便可进入使用@SaCheckLogin注解的方法了。