vue使用axios封装接口的请求（完整详细的项目封装和接口使用过程，附有axios的ts源码）

//使用 "axios"封装一下请求的接口 vue项目为例

第一部分：request.js内容：

//引入axios
import axios from "axios";
import Cookies from "js-cookie";
const service = axios.create({
    baseURL: process.env.MY_PROJECT_URL, // api 的 base_url  也就是代表各个环境 比如dev test 等
    timeout: 10000  //默认全部接口的请求的时间
});
// 请求时的拦截器
service.interceptors.request.use(
    config => {
      //请求的处理 比如处理请求头和TOKEN等等
        config.headers.Authorization = Cookies.get("access_token") || "";
        config.headers.APP_TOKEN = localStorage.appToken || "";
       //处理完允许往下执行请求
        return config;
    },
    error => {
       //报错请求抛异常信息
        Promise.reject(error);
    }
);

// 响应时的拦截器
service.interceptors.response.use(
    response => {
        // 后端报错处理
        if (response.data.code !== "0") {
           //一般这里处理的是接口请求报错的各种情况 -- 根据情况自己处理
        } else {
            // 请求正常