0

vue.jsを使用し、axiosでpostした際に、status:500が返ってきてもcatchに入ってくれません。

  await this.axios
    .post('/user', data)
    .then(response => {
      console.info(response.data)
      this.result = response.data
    })
    .catch(error => {
      console.info(error)
    })

status:500が返ってきた場合のエラーハンドリングの仕方はどんなのがありますか。
よろしくお願い致します。

1 件の回答 1

3

自己解決しました。

下記の部分でコンソールにログを表示していましたが、
これが、ブラウザ標準のエラーログと勘違いしていました。

.catch(error => {
  console.info(error)
})

console.info(error)の結果

Error: Request failed with status code 500
at createError (createError.js?16d0:16)
at settle (settle.js?db52:18)
at XMLHttpRequest.handleLoad (xhr.js?ec6c:77)

下記のようにconstで受け取り、statusを判定することで、
status毎の処理分岐ができそうです。

async get404 () {
  const test = await this.$axios
    .get('/404')
    .then(response => {
      console.info(response.data)
      this.result = response.data
    })
    .catch(error => {
      console.info(error)
      return error
    })
  if (test.response.status === 404) {
    console.info('ページが見つかりません')
  }
}

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。