axios使用 & 拦截器

1.安装

安装axios

npm install axios

2._aixos定义

import axios from "axios";
import {userInfoStore} from "@/stores/counter.js";
import router from "@/router/index.js";

const _axios = axios.create({
    baseURL: "http://127.0.0.1:8000",
    timeout: 20 * 1000
})

// request拦截器
_axios.interceptors.request.use(function (config) {
    // 1.去pinia中读取当前用户token
    const store = userInfoStore()

    // 2.发送请求携带token
    if (store.userToken) {
        if (config.params) {
            config.params['token'] = store.userToken
        } else {
            config.params = {token: store.userToken}
        }
    }
    return config;
})

// response拦截器
// 根据状态码不同会走这两个函数：200成功走第一个，失败走第二个
_axios.interceptors.response.use(function (response) {
    const store = userInfoStore()
    if (response.data.code === 2002) {
        // 认证失败(jwt token)
        store.doLogout()
        router.replace({name: "login"});
    } else if (response.data.code === 2003) {
        //无权访问
        router.replace({name: "home"});
    }
    return response;
}, function (error) {
    // 使得_aixos后续可以.catch（尽量让后端返回的都是200，实在不行再用_axios的地方.catch，而不是再这里处理异常码）
    return Promise.reject(error);
})

export default _axios

3.使用时记得在使用页面引入_axios