XHRの並列処理の記述

Question

XHRで並列処理のようなことがしたいのですが記述がわかりません
やりたい処理は下記のようなことです(動きませんが)
3つのURLに対し同時にリクエストを投げる＝並列処理になるとみていいでしょうか？
どうしたら動くようになりますでしょうか

<script>
window.onload=function(){
var url=["1.html","2.html","3.html"];
var data_list=["1","2","3"];
for(i=0;i<url.length;i++){
var formdata = new FormData();
formdata.append("data",data_list[i]);
xmlhttp[i] = new XMLHttpRequest();
xmlhttp[i].overrideMimeType("text/plain; charset=utf-8");
xmlhttp[i].addEventListener('loadend', function(){
if(xmlhttp[i].status === 200){
alert(xmlhttp[i].responseText);
}
});
xmlhttp.open("POST", url[i], true);
xmlhttp.send(formdata[i]);
}
}
</script>

Comments

[退会済みユーザー]

HTTPをリクエストする手段としては、XHR を使うことが前提でしょうか？　それとも、他の方法による回答もアリなのでしょうか？

Answer 1

3つのURLに対し同時にリクエストを投げる＝並列処理になるとみていいでしょうか？

はい。質問文のコードのアプローチで並列処理になります。open(..., true) と send() を次々と呼べばOKです。細かな問題を修正すれば動くようになるでしょう。

●ループの変数が宣言されていない
for(i=0;i<url.length;i++){
→ for (let i = 0; i < url.length; i++) {

●変数xmlhttpが宣言されていない
ローカル変数でいいです。
xmlhttp[i] = new XMLHttpRequest();
→ let xmlhttp = new XMLHttpRequest();
以下、すべての xmlhttp[i] を xmlhttp に変更

●変数formdataのアクセス方法間違い
xmlhttp.send(formdata[i]);
→ xmlhttp.send(formdata);