URLのリストをLOOP→POSTして、全て終了したら処理をする方法

Question

とりあえずJQueryを使ってこう書いているのですが

list = ["URL1","URL2","URL3"]
count = 0

$.each(list,function(){
$.post(this,{},function(){
count++
})
})

setInterval(function(){
if(count == list.length){
alert("終わりました")
}
},1000)

ポストが全部終わったら処理を追加しようとしてsetIntervalでcountを監視させる方法を考えているのですが
setIntervalは推奨されないとどこかで見たので、
みなさんはどうしているのかなと思いまして。
教えていただければ幸いです。

Comments

[退会済みユーザー]

> setIntervalは推奨されないとどこかで見たので、

質問にはどこにもそんなコードは見当たりませんけど？　コードをある程度全体が分かるように書いてください。あと、投げっぱなしで良いのか、一度に出せる HTTP 要求の数は限られてないのかなどの条件も。

[tarara]

すみません、これから追加しよう思案している部分だったので書いていませんでした
そちらも追記して修正しました。
HTTP要求数は限られてないという形で大丈夫です。

Answer 1

非同期で複数postしてすべての戻りをまって処理するなら
Promise.all＋fetchでしょうね

const b1=new FormData();
b1.append("a",1);
const b2=new FormData();
b2.append("b",1);
const b3=new FormData();
b3.append("c",3);
Promise.all([
  fetch(url,{method:'post',body:b1}).then(res=>res.text()),
  fetch(url,{method:'post',body:b2}).then(res=>res.text()),
  fetch(url,{method:'post',body:b3}).then(res=>res.text()),
  ]).then(data=>{
    console.log(data);
  });

Comments

[yambejp]

jQueryなら$.when＋$.ajaxを利用してください

[tarara]

ありがとうございます、書いていただいたコードにURLのリストを流してみたのですが
これだと終了処理( console.log(data);)が結局リストの数だけ行われてしまいました。
なにかおかしいのでしょうか？

list = ["URL1","URL2","URL3"];

list.forEach(function(){
let url = this;
const b1=new FormData();
b1.append("a",1);
const b2=new FormData();
b2.append("b",1);
const b3=new FormData();
b3.append("c",3);
Promise.all([
fetch(url,{method:'post',body:b1}).then(res=>res.text()),
fetch(url,{method:'post',body:b2}).then(res=>res.text()),
fetch(url,{method:'post',body:b3}).then(res=>res.text()),
]).then(data=>{
console.log(data);
});
})