リクエスト数を制限するために Ajax 同時リクエストを実装するために js を使用するサンプル コード

var p = 関数() {
 新しいPromise(function(resolve,reject))を返す{
  タイムアウトを設定する(() => {
   コンソールログ('1000')
   解決する（）
  }, 1000)
 })
}
var p1 = 関数() {
 新しいPromise(function(resolve,reject))を返す{
  タイムアウトを設定する(() => {
   コンソールログ('2000')
   解決する（）
  }, 2000)
 })
}
var p2 = 関数() {
 新しいPromise(function(resolve,reject))を返す{
  タイムアウトを設定する(() => {
   コンソールログ('3000')
   解決する（）
  }, 3000)
 })
}


p().then(() => {
 p1() を返す
}).then(() => {
 p2() を返す
}).then(() => {
 コンソールログ('終了')
})

var promises = 関数 () {
 [1000, 2000, 3000].map(current => { を返します。
  新しいPromise(function(resolve,reject))を返す{
   タイムアウトを設定する(() => {
    console.log(現在)
   }、 現在）
  })
 })
}

Promise.all(promises()).then(() => {
 コンソールログ('終了')
})

Promise.all(promises: []).then(fun: function);

関数 multiRequest(urls = [], maxNum) {
 //リクエストの合計数 const len ​​= urls.length;
 // リクエスト数に基づいてリクエスト結果を保存する配列を作成します。const result = new Array(len).fill(false);
 // 現在完了した数 let count = 0;

 新しい Promise を返します ((resolve, reject) => {
  // maxNum をリクエストします while (count < maxNum) {
   次（）;
  }
  関数 next() {
   現在の値を count++ とします。
   // 境界条件を処理する if (current >= len) {
    // すべてのリクエストが完了したら、Promise を成功状態に設定し、結果を Promise 値として返します。result.includes(false) && resolve(result);
    戻る;
   }
   const url = urls[現在の];
   console.log(`start ${current}`、新しいDate().toLocaleString());
   フェッチ(url)
    .then((res) => {
     // リクエスト結果を保存します。 result[current] = res;
     console.log(`Completed${current}`, 新しい Date().toLocaleString());
     // リクエストが完了していない場合は、if (current < len) {を再帰します。
      次（）;
     }
    })
    .catch((エラー) => {
     console.log(`${current}` の終了、新しい Date().toLocaleString());
     結果[現在] = err;
     // リクエストが完了していない場合は、if (current < len) {を再帰します。
      次（）;
     }
    });
  }
 });
}

  // タスクリスト->新しいタスク uploadFile() {
   _this = this とします。
   var アップロードスレッド制限数 = 3,
    アップロードスレッド数 = 0、
    送信完了数 = 0、
    結果終了数 = 0;
   var マーク = 0;
   var タスク = [];
   var アップロード = 関数 () {
    （アップロードスレッド数 < アップロードスレッド制限数）{
     （sendFinishNum >= _this.fileList.length）の場合{
      結果完了数 >= _this.fileList.length の場合 {
       creatTask(); // リクエストを完了する}
      戻る;
     }
     (関数(j) {
      item = _this.fileList[j]とします。
      p = new FormData();
      p.append("ファイル", 項目);
      タスク.push(
       アクシオス({
        メソッド: "post",
        url: `${window.UL_CONFIG.BASEURL}/api/files/upload`,
        データ: p,
        onUploadProgress: (progressEvent) => {
         (let i in _this.rowData) {
          _this.rowData[i].name === アイテム.name
           ? (_this.rowData[i].percent = Math.round(
             (progressEvent.loaded / progressEvent.total) * 100
            ))
           : "";
         }
        },
       })
        .then((res) => {
        /* obj = {} とします。
         obj.url = `${window.UL_CONFIG.BASEURL}/api/files/${res.data}`;
         obj.fileName = アイテム名;
         obj.fmt = _this.ruleForm.format;
         obj.samplingRate = _this.ruleForm.samplingRate;
         fileUrls.push(obj); */
        })
        .catch((e) => {
           ? (_this.rowData[i].パーセント = 0)
         _this.$notify.error({
          タイトル: 「エラー」、
          メッセージ:「サービス接続エラー」+ item.name +「アップロードに失敗しました」
         });
        .finally(() => {
         アップロードスレッド数--;
         結果終了数++;
         アップロード（）;
      );
     })(送信完了番号);
     アップロードスレッド数++;
     送信完了番号++;
    }
   };
   var createTask = 関数 () {
    axios.all(タスク).then((res) => {
     //新しいアップロードタスクを作成する/* let fd1, fd2, calcFlag, flagArr, language;
     fd1 = {};
     flagArr = Object.assign([], _this.ruleForm.checkList);
     if (_this.ruleForm.recognize == "自動認識") {
      flagArr.push("2");
     calcFlag = flagArr.reduce(
      (accu, curr) => 数値(accu) + 数値(curr)
     );
     _this.ruleForm.recognize == "自動的に認識する"
      ? (言語 = "")
      : (言語 = _this.ruleForm.recognize);
     fd1.processContent = calcFlag;
     fd1.remark = _this.ruleForm.remark;
     fd1.name = _this.ruleForm.taskName;
     fd1.fmt = _this.ruleForm.format;
     fd1.サンプリングレート = _this.ruleForm.サンプリングレート;
     fd1.language = 言語;
     fd1.type = 1; // タイプ: 1 オーディオ、2 ビデオ fd1.files = fileUrls; */
     newTask(fd1).then((res) => {
      /* _this.cmpltBtnState = false;
      _this.$store.commit("setTaskId", res.data.id);
      _this.submitFailNumber = res.data.submitFailNumber; */
      _this.$parent.dataInit();
     });
    });
   アップロード（）;
  },