你如何让 axios GET 请求等待?

2022-01-20 00:00:00 axios arrays node.js fetch javascript

您好，我在使用 axios/fetch GET 时遇到问题，该 URL 具有一个参数，该参数通过数组循环迭代其值

Hi I'm having a problem with using axios / fetch GET with a URL that has a parameter that iterates through an array loop for its values

axios/fetch 不遵循数组的顺序，只返回先出现的响应.

axios / fetch doesn't follow the order of the array and just returns whichever response comes first.

我该如何解决这个问题?

How would I fix this?

const fetch = require("node-fetch");

algo = "eth" // algorithm for wtt

hashrate = ['250', '100', '50']

console.log(hashrate)


for (var i = 0; i < vhr.length; i++){

var wttURL = "https://whattomine.com/coins.json?" + algo + "=true" + "&factor%5B" + algo + "_hr%5D=" + hashrate[i]



fetch(wttURL)
.then((resp) => resp.json()) // Transform the data into json
.then(function(data) {
  console.log(data.coins.Ethereum.btc_revenue)
  })

目前的输出是 250 (a)、100 (b) 或 50 (c) 的结果

The output for this currently is either the results for 250 (a), 100 (b) or 50 (c)

所以基本上它要么会出现

So basically it would either come out as

a、b、c(需要)

b、c、a

a、c、b

c、b、a

等等

但我希望它按照顺序输出所以应该是

But I want it to output according to the order so it should be

a ,b ,c 总是

推荐答案

选项 1:Promise.all

简而言之:您可以使用 Promise.all() 如果您需要特定的订单.您创建一个充满承诺的数组，将其传递给 Promise.all()，您将获得一个包含已解决承诺的数组.

In short: you can use Promise.all() if you need a specific order. You create a an array filled with promises, pass it to Promise.all() and you'll get an array with resolved promises. 

const fetch = require("node-fetch");

algo = "eth" // algorithm for wtt
hashrate = ['250', '100', '50']

wttURL = [];

for (var i = 0; i < vhr.length; i++) {
    wttURL.push(fetch("https://whattomine.com/coins.json?" + algo + "=true" + "&factor%5B" + algo + "_hr%5D=" + hashrate[i]))
}

Promise.all(wttURL)
    .then(responses => responses.forEach(response => console.log(response)))
    .catch(err => console.log(err));

但是，由于第一个拒绝的承诺的原因，它失败了.因此，如果您有一个大数组或需要显示任何数据，则不应使用此方法.此外，这将只保留客户端上的订单！您的后端不会知道任何关于订单的信息，因为调用没有按顺序完成.

However, it fails with the reason of the first promise that rejects. So if you have a big array or you need to display any data you should not use this method. In addition, this would keep the order on the client only! Your backend would not know anything about the order since the calls are not done in order.

选项 2:异步/等待

您可以改用 async/await.您将 await 每个结果，如果其中任何一个失败，您不必在意，因为其余的仍然可以成功.此外，您的后端也可以跟踪订单.

You could use async/await instead. You would await each result and if any of them fails you do not care since the rest still can succeed. Also, your backend would be able to keep track of the order too.

async function getData() {
    for (var i = 0; i < vhr.length; i++) {
        let wttURL = "https://whattomine.com/coins.json?" + algo + "=true" + "&factor%5B" + algo + "_hr%5D=" + hashrate[i]
        await fetch(wttURL)
                .then(resp => resp.json()) // Transform the data into json
                .then(data => console.log(data.coins.Ethereum.btc_revenue))
                .catch(err => console.log(err));
    }
}

这种方法会保留客户端和后端的原始顺序(如果您记录它).但是，它比第一个解决方案慢，因为它不会继续下一个 fetch，直到 promise 被解决.

This approach preserves the original order on the client and backend (if you log it). However, it is slower than the first solution since it does not continue with the next fetch until the promise is resolved.

相关文章