使用 try and catch 处理状态 500答案

【问题标题】：Handling status 500 with try and catch使用 try and catch 处理状态 500
【发布时间】：2022-01-14 11:17:51
【问题描述】：

我不知道处理我的 API 发送的状态 500 的最佳方式是什么。请你帮助我好吗？在下面的情况下，当我的 API 响应状态为 500 时，我希望在我的 redux 存储中设置错误消息。当我的 API 发送成功的状态码时，我希望在我的商店中“获取用户套牌”。

我的第一次尝试让我觉得合乎逻辑且枯燥，但没有成功：

const createDeck = async () => {
        try {
          const request = await fetch(`${back}/deck/`, options)
          const response = await request.json()
          store.dispatch({ type: FETCH_USER_DECKS })
        } catch (error) {
          store.dispatch({ type: SET_ERROR, message: error })
        }
      }

当 API 发送 500 状态时，似乎没有抛出异常，并且我的 catch 块中的代码被忽略。

我的第二次和第三次尝试都成功了，我也排除了它们，但它们感觉令人费解和奇怪：

第二次尝试：

 const createDeck = async () => {
        try {
          const request = await fetch(`${back}/deck/`, options)
          const response = await request.json()
          if (request.status === 201 || request.status === 200) {
            store.dispatch({ type: FETCH_USER_DECKS })
          } else {
          store.dispatch({ type: SET_ERROR, message: error })
          }
        } catch (error) {
          console.log('error')
        }
  }

这可行，但它完全忽略了 catch 块，这让我想知道：那么 try...catch 有什么意义？

第三次尝试：

  const createDeck = async () => {
    try {
      const request = await fetch(`${back}/deck/`, options)
      const response = await request.json()
      if (request.status === 201 || request.status === 200) {
        store.dispatch({ type: FETCH_USER_DECKS })
      } else {
        throw response
      }
    } catch (error) {
      store.dispatch({ type: SET_ERROR, message: error })
    }
  }

这第三次尝试使用了catch，但是手动抛出异常感觉很奇怪，被catch立即捕获。

我错过了什么吗？

【问题讨论】：

查看Fetch 文档：“即使响应是 HTTP 404 或 500，从 fetch() 返回的 Promise 也不会拒绝 HTTP 错误状态”。这就是为什么catch 块在状态为 500 的情况下被忽略的原因：promise 解决并且没有抛出错误。
感谢您回复 Ibsn。是的，我注意到状态 500 不会引发异常。那么我的问题是：好的做法是什么？当状态为 500 时，我应该手动抛出异常，并在 catch 块中编写代码（尝试 3），还是只在我的 try 语句中编写条件（尝试 2），或者其他什么？
我个人觉得这两个选项都可以。由于您使用的是fetch()，因此采用其实现模型并且不将 500 响应视为异常（尝试 2）可能是有意义的。但是我也不认为您的第三次尝试有任何问题（例如，axios 在这种情况下会引发错误）。请注意，fetch() 响应公开了一个 ok 属性以检查请求是否成功。
谢谢你，这帮助很大！我不知道 request.ok，也不知道 axios 允许为不同的状态配置抛出异常。
（顺便说一句，这解决了我的问题。再次感谢）

标签： javascript error-handling fetch try-catch

【解决方案1】：

Isbn 在 cmets 中正确回答了这个问题。我再次将其放在这里以提高知名度： “由于您使用的是 fetch()，因此采用其实现模型并且不将 500 响应视为异常（尝试 2）可能是有意义的。但我也不会认为您的第三次尝试有任何问题（axios，例如，在这种情况下会引发错误）。请注意，fetch() 响应公开了一个 ok 属性来检查请求是否成功"

【讨论】：