在vue项目封装第三方模快axios 进行网络请求并且 配置请求拦截器和响应拦截器

export function request(config) {

    // 1)创建axios的实例
    const baseURL='/api' //接口的基本路径
    const instance=axios.create({
        baseURL:baseURL,
        timeOut:5000,
    })

    //2.1)axios 的请求拦截器interceptor.request
    instance.interceptors.request.use(config=>{

        //在请求拦截器可以做以下操作

        // 1)config中的信息不符合服务器要求

        // 2)每次发送请求时,在界面显示一个图标 show出来(在成功响应的拦截器中隐藏)

        // 3)某些网络请求(比如登录(token)),必须携带一些特殊信息{判断路径,看是否有token}

        return config;//最后必须做的一步
    },err=>{

    })

    //2.2axios 的 响应拦截interceptors.response
    instance.interceptors.response.use(res=>{
        return res
    },err=>{})

    //3)发送网络请求
   return instance(config)//方法返回一个promise,通过.then拿到结果
  
}
发布了21 篇原创文章 · 获赞 0 · 访问量 321

猜你喜欢

转载自blog.csdn.net/weixin_46337813/article/details/104633232