Vue----axios拦截器的使用

Posted 2022-12-27 fdxjava

import axios from ‘axios‘

export function request(config)
return new Promise((resolve, reject) => 
    //1.创建实例--配置
const instance = axios.create(
    baseURL: ‘地址‘，
    timeout: 5000
)

//2.axios拦截器--request请求拦截(需求：拦截后修改配置信息)---
instance.interceprors.request.use(config => 
    console.log(config);//这里打印的是一些成功后的请求配置信息
    //request请求拦截(需求：拦截后修改配置信息,2.配置请求动画图标3.某些网络请求-登录携带token
    return config  //拦截后要返回，不然报错，接收不到数据
, err => 
    console.log(err);
)
 //响应拦截
instance.interceprors.response.use(res => 
   return res //返回--不认别的地方拿不到这个数据
, err => 
    
)

//3.发送真正的网路请求--引用配置
instance(config)
    .then(res => 
        //将获取到的数据返回给引用者--通过resolve函数
        resolve(res)
    )
    .catch(err => 
        reject(err)
    )
)