fetch()函数中的捕获错误

时间:2018-01-19 11:14:05

标签: javascript error-handling fetch es6-promise fetch-api

我最近学到了一些关于fetch()和promise的知识,现在我需要在项目中使用它。这里我有一个fetch()函数,它运行得很好,但我想,它必须捕获一个错误。那么,在fetch()函数中捕获错误的最佳方法是什么?我需要在两个()中捕获它们? 这里有一些代码:

const endpoint = 'http://localhost:3030/api/hotels';
const promise = fetch(endpoint)
   .then(res => res.json(), err => {
      console.log(err);
   })
   .then(parseRooms, err => {
      console.log(err);
   })

谢谢!

1 个答案:

答案 0 :(得分:5)

使用承诺处理程序链接在一起的事实。每次调用thencatch都会创建一个新的承诺,该承诺会链接到前一个承诺。

所以在你的情况下:

const promise = fetch(endpoint)
    .then(res => res.json())
    .then(parseRooms)
    .catch(error => {
        // Do something useful with the error
    });

我假设parseRooms在收到的结构出现问题时会抛出错误。

您可能也想在那里检查res.ok,因为如果出现网络错误,fetch只有失败,而不是因为存在HTTP错误,例如404:

const promise = fetch(endpoint)
    .then(res => {
        if (!res.ok) {
            throw new Error(); // Will take you to the `catch` below
        }
        return res.json();
    })
    .then(parseRooms)
    .catch(error => {
        // Do something useful with the error
    });