PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > 编程杂谈 > 正文

    axios先执行自定错误后在执行全局错误

    作者:admin来源:网络浏览:时间:2021-01-30 18:06:08我要评论
    导读:由于 axios 拦截器的代码会比 catch 先执行,所以当执行到 catch 时,实际上 response 拦截器的代码已全部执行完成
    由于 axios 拦截器的代码会比 catch 先执行,所以当执行到 catch 时,实际上 response 拦截器的代码已全部执行完成

    看了 axios request 方法源码后得知,框架在发起请求时,并没有给我提供相应的钩子;所以在 Promise 执行到 catch 时,拦截器里的代码一定已经执行过了。

    我们只能依赖 axios 提供的 config 来完成这个特性,如下所示:

    1. axios.interceptors.response.use(function (response) { 
    2.     return response; 
    3. }, function (error) { 
    4.     error.globalErrorProcess = function () { 
    5.         switch (this.response.status) { 
    6.             case 401: // 处理基本 401 错误 
    7.                 break
    8.             case 404: // 处理基本 404 错误 
    9.                 break
    10.             case 403: // 处理基本 403 错误 
    11.                 break
    12.                       // 处理其他4xx/5xx等基本错误的处理 
    13.         } 
    14.  
    15.         return Promise.reject(this); 
    16.     }; 
    17.  
    18.     if(error.config.hasOwnProperty('catch') && error.config.catch == true) { 
    19.         return Promise.reject(error); 
    20.     } 
    21.  
    22.     return error.globalErrorProcess() 
    23. }); 
    24.  
    25.  

    我们定义一个全局的错误处理器,并把他赋给 error 对象的 globalErrorProcess 方法。接着判断当前请求 config 是否启用 catch,若启用,默认不进行任何错误处理,交由调用方自行负责;否则用全局错误处理。

    在使用时,若需要自定义捕获错误,可显示传递一个 config,相应请求方法的 API 如下:

    axios.request(config)
    axios.get(url[, config])
    axios.delete(url[, config])
    axios.head(url[, config])
    axios.options(url[, config])
    axios.post(url[, data[, config]])
    axios.put(url[, data[, config]])
    axios.patch(url[, data[, config]])
     

    1. axios.post('https://api.github.com/xxx'null, {catchtrue}).then(function (response) { 
    2.     console.log(response); 
    3. }).catch(function (error) { 
    4.     let code = error.response.data.error_code 
    5.  
    6.     if (code == 4291011) { 
    7.         // 今日投票次数太多,显示关注公众号二维码 
    8.     } else if (code == 4031011) { 
    9.         // 不允许的投票时间段, 
    10.     } else if (code == 4291012) { 
    11.         // 作品票数异常,需先通过滑动验证码 
    12.     } 
    13.  
    14.     return error.globalErrorProcesser() 
    15. }); 

     

    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-74-6494-1.html