axios -＞拦截器

最新推荐文章于 2024-05-22 12:08:02 发布

this-way

最新推荐文章于 2024-05-22 12:08:02 发布

阅读量72

点赞数

分类专栏： HTTP库文章标签： http

本文链接：https://blog.csdn.net/Un_YUI/article/details/113618815

版权

HTTP库专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
  <title>Document</title>
</head>
<body>
  
</body>
<script>
  //成功执行顺序①~③
  //失败执行顺序-1 ~ -3
  //请求拦截
  axios.interceptors.request.use(function(comfig){
    console.log("请求成功")
    // return comfig ① -1
    throw "自定义请求失败"//自定义一个错误抛出
    console.log("111")//不会执行
  },function(error){
    console.log("请求error")
    return Promise.reject(error)
  })
  //响应拦截
  axios.interceptors.response.use(function(comfig){
    console.log("响应成功")
    return comfig //②
  },function(error){
    console.log("响应error")
    return Promise.reject(error) //上面请求成功后抛出了错误 so不再走响应成功 -2
  })

  axios({
    method: "get",
    url: "https://api.it120.cc/conner/shop/goods/category/all",
    data: {}
  }).then(response=>{console.log(response)})//③
  .catch(req=>{console.log("error")})//-3



  //使用拦截器对请求回来的数据 or 发出之后的数据进行操作
  axios.interceptors.request.use(function(comfig){
    console.log("请求成功")
    console.log(comfig)//这里就是发送请求时的配置项
    return comfig
  },function(error){
    console.log("请求error")
    return Promise.reject(error)
  })
  //响应拦截
  axios.interceptors.response.use(function(request){
    console.log("响应成功")
    console.log(request)//这里就是响应会来的所有数据，可以进行处理后在.then里接受，
    //例如：只要data里的数据
    return request.data//返回request对象里的data对象数据①
  },function(error){
    console.log("响应error")
    return Promise.reject(error)
  })

  axios({
    method: "get",
    url: "https://api.it120.cc/conner/shop/goods/category/all",
    data: {}
  }).then(response=>{console.log(response)})//使用响应拦截器把请求回的数据进行处理response接受①
  .catch(res=>{console.log("error")})
</script>
</html>

this-way

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
axios -＞拦截器

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <script src="https://
复制链接

扫一扫