我应该如何在 VUEJS 中捕获和处理 406 错误答案

【问题标题】：How should i catch and handle 406 error in VUEJS我应该如何在 VUEJS 中捕获和处理 406 错误
【发布时间】：2020-06-04 16:49:40
【问题描述】：

我有一条路线，我在当天发送到 api，然后在数据库中验证时间表中是否有空缺，如果不是，api 正在发送 406。我遇到了控制台 406 错误。我应该如何处理该错误以拥有干净的控制台？

【问题讨论】：

请发布您的一些代码/工作，然后只有我们可以帮助您。
请提供 JSFiddle 或 CodePen 以及您尝试让人们轻松调试您的问题的代码。

标签： javascript api vue.js user-interface

【解决方案1】：

您可以简单地将 api 调用包装到 try-catch 中，并且在 catch 部分中不使用 e 做任何事情。

try { ... you code here ... } catch(e){}

【讨论】：

【解决方案2】：

如果您使用 Axios 进行 API 调用，您可以创建一个全局拦截器并根据您的状态代码向您的组件返回响应。这将进入您的 main.js。

axios.interceptors.response.use(null, function(error) {
    console.log(error);
 if(err.response.status === 406){
       //your code here.
    }
    return Promise.reject(error);
});

【讨论】：

【解决方案3】：

您可以将您的呼叫包装在 try{} catch(e) {} 中以处理错误发生后发生的情况

但无法以编程方式阻止浏览器在控制台中显示错误，因为脚本可能会滥用错误请求以向用户隐藏其活动的潜在风险。

【讨论】：

【解决方案4】：

check_time(day,hour){
    var fields = {};
    fields.day = parseInt(day);
    fields.hour = parseInt(hour);

    try {
        this.$http.post('courses/check', fields)
    } catch {
        this.$store.dispatch('alert', {'message': 'Already exist a course in this interval.'});
    }

}

【讨论】：