【vue项目小结】vue项目发起axios模块化案例

一）封装axios，
1）创建requer.js

//对于axios进行二次封装
import axios from 'axios';
//引入进度条 
import nprogress from "nprogress";
import 'nprogress/nprogress.css'
// start:进度条开始 done：进度条结束

//1.利用axios对象的方法create去创建axios实例
// 2.request就是axios
const requests = axios.create({
   
        // 基础路径
        baseURL: '/api',
        // 代表请求超时的时间5s
        timeout: 5000,
    })
    //请求拦截器：在发请求之前，请求拦截器可以检测，可以1在发出去之前可以做一些事情
requests.interceptors.request.use(config => {
   
    //config:配置对象，对象里面有一个属性,headers请求头
    //进度条开始动
    nprogress.start();
    return config;
})

//响应拦截器
requests.interceptors.response.use((res) => {
   
    //成功的回调函数，服务器响应数据回来以后，响应拦截器可以检测到
    // 进度条成功
    nprogress.done()
    return res