使用 fetch 时拒绝承诺

Question

我对如何正确使用 fetch 有点困惑。即使我返回错误状态，它似乎也能解决。下面的代码是否正确（将获取包装在另一个承诺中）？

function a(url, config) {
  if (!config)
    config = {};

  config = Object.assign(config, {
    headers: {
      'content-type': 'application/json;charset=utf-8'
    }
  })
  return new Promise(
    function(resolve, reject) {
      fetch(url, config).then(
        function(res) {
          if (res.status == 200 && res.ok) {
            console.log("Promise resolved")
            resolve(res);
            return;
          }
          console.log("Promise rejected")
          reject(res);
        },
        function(rej) {
          console.log("promise rejected")
          reject(rej);
        }
      )
    }
  )
}

function b() {
  a('/test').then(
    function(res) {
      console.log('success');
      console.log(res)
    },
    function(rej) {
      console.log('Rejected');
      console.log(rej)
    }
  )
}

b();

（上面的代码应该运行通过控制台在 chrome 中正常......只是 copy/paste ）

Answer 1

如果你想拒绝成功回调，你需要通过返回被拒绝的承诺来明确地做到这一点，例如return Promise.reject('error occurred'); 或通过投掷。

此外，你不应该在你的情况下滥用 Promise 构造函数，因为 fetch 已经 returns promise object:

function a(url, config) {
    if (!config)
        config = {};

    config = Object.assign(config, {
        headers: {
            'content-type': 'application/json;charset=utf-8'
        }
    });

    return fetch(url, config).then(
        function(res) {
            if (res.status == 200 && res.ok) {
                console.log("Promise resolved")
                return res.json();
            }
            console.log("Promise rejected");
            throw 'promise rejected';
        },
        function(rej) {
            console.log("promise rejected");
            throw 'promise rejected';
        }
    );
}

使用 fetch 时拒绝承诺

Rejecting promise when using fetch

javascript

angularjs

ecmascript-6

fetch-api