Fetch within promise,零星的反向链序

Fetch within promise, sporadical reversed chain order

我将两个调用链接到一个使用 fetch 和 returns 承诺的函数。

呼叫有时会以错误的顺序到达,相反。

我假设我的函数代码是错误的,源于对 promises、fetch 或两者的错误理解。

这是功能代码,简化后:

function shop(id) {
  return new Promise(function(resolve, reject) {
    fetch('/shop', {
      method: 'post',
      body: JSON.stringify({id: id}) ,
      headers: {'Content-type': 'application/json '}
      }).then(function (response) {
        return response.json();
      }).then(function (data) {
        console.log(data);
        resolve(data);
      })
  })
}

我以这种方式链接函数:

shop('potatoe')
.then(shop('mushrooms'));

如前所述,这两个有时会按错误的顺序到达,蘑菇先于土豆。

我的 returns 或 resolve() 是否写错了 shop() 函数?

感谢您的帮助。

主要问题是您立即同步调用 shop('mushrooms')。您没有 传递 then 方法的回调,而是 执行了 预期的回调。所以把主要代码改成:

shop('potatoe')
.then(() => shop('mushrooms'));

这解决了您的问题。

但是,您在函数中创建了无用的承诺。 fetch().then().then()已经returns一个承诺;你不需要再创建一个。了解 promise constructor antipattern.

所以删除这个 new Promise 包装器,并删除最后的 .then() 调用,它只在那里调用 resolve:

function shop(id) {
    // return the promise returned by this promise chain:
    return fetch('/shop', {
        method: 'post',
        body: JSON.stringify({id: id}) ,
        headers: {'Content-type': 'application/json '}
    }).then(function (response) {
        return response.json();
    });
}