vue版本3.x
下来看我我的目录结构：

然后直接上代码

import axios from 'axios';
const service = axios.create({
    timeout: 5000
});
config => {
        return config;
    },
    error => {
        console.log(error);
        return Promise.reject();
    };
service.interceptors.request.use((config) => {
    const token = localStorage.getItem('token')
    if (token) {
        // 请求头携带token
        config.headers.token = token
    }
    console.log('正在加载....')
    return config
}, (error) => {
    return Promise.reject(error)
})
service.interceptors.response.use(
    response => {
        if (response.status === 200) {
            return response.data;
        } else {
            Promise.reject();
        }
    },
    error => {
        console.log(error);
        return Promise.reject();
    });

export default service;

免得有些小伙伴不理解我给大家看下完整的，这里上边首先是封装的axios请求，然后我在api里边写的接口信息

接下来看我的页面引用

import { code, login } from "../api/login";

这里花括号要和你api那个index里面的封装每个接口的名字要对应上

 logins() {
      let data = {
        mobile: this.mobile,
        credentials: this.credentials,
        type: "0",
      };
      login(data).then((res) => {
        if (res.code === 200) {
          localStorage.setItem("token", res.data.accessToken);
          this.$router.push("/");
        }
      });
    },

这里是我登陆接口代码，登陆成功后存放在localStorage，再通过上边第一次的请求里面的操作，token就成功存放到header里面啦。