console.log中出现Axios Stop 404错误

Question

我正在检查通过Axios是否存在资源，正常情况下会期望返回404（如果不存在）。

但是，当返回404时，它将显示在控制台中。我已经尝试捕获该错误，但这并不能阻止chrome显示该错误。

        axios.get('/api/user/checkin').then((response) => {
            Vue.set(UserStore,'checkin', response.data)
            this.loading = false;
        }).catch((error) =>{})

我正在检查用户是否被检查过，我将返回他们登录时的记录以及网站上的一些详细信息。

如果不是，那么我什么也没要退回，所以我要退回404。我可以退回一条空白记录，但这确实让我很不安。

Answer 1

这是 chrome行为。请参阅this和also this。
您可以按照this answer的建议在捕获中进行console.clear()。

axios.get('/api/user/checkin')
  .then((response) => {
    Vue.set(UserStore,'checkin', response.data)
    this.loading = false;
  })
  .catch(() => console.clear()) // this will clear any console errors caused by this request

或
.catch(console.clear)的简称。

但是请注意，您将丢失所有以前的控制台日志。

编辑：

仅在收到404响应时，您可能希望清除控制台。

axios.get('/api/user/checkin')
  .then((response) => {
     Vue.set(UserStore,'checkin', response.data)
     this.loading = false;
  })
  .catch((error) => {
    if(error.response && error.response.status === 404) {
      console.clear();
    }
  })

有关更多信息，请参见handling errors in Axios。

Answer 2

与其执行console.clear，这会清除整个控制台，却很难显示您实际需要的日志。尝试检查Chrome控制台选项中的Hide Network选项。它将为您隐藏所有网络错误，这可能是控制台中从网络显示的唯一内容。

例如

未选中：

已检查：