Javascript - 如何将 99 个数组元素分批传递给 HTTP POST 请求并继续 HTTP POST 直到传递完所有数组元素

Javascript - How to pass array elements in batches of 99 to HTTP POST request and continue HTTP POST's until all array elements have been passed

我试图一次将 99 elements/values 个数组传递给我正在完成的 Web 应用程序的 XMLHttpRequest。 Array 有超过 99 条记录,并且会随着时间的推移而增长,因为它会从数据库中提取用户信息。我的目标是能够一次从该数组发送包含 99 个元素的大量 HTTP POST 请求,或者直到数组的所有元素都已传递为止。也就是说,每批 99 个元素 and/ora 最后一批包含数组中最后几个剩余元素(少于 99 个)。我正在使用的方法似乎应该有效,但目前无效。这是我正在使用的代码:

      function sendPushNotification(allRecipients) {
        var listComplete = allRecipients.length;
        var batchMaker = 0;
        var batchRecipients;
        var batchNumber = 0;
        var recipientsProcessed = 0;
        for (batchMaker = 0; batchMaker < 99; batchMaker++) {
          batchRecipients =
            allRecipients[batchMaker] + `","` + batchRecipients;
          console.log(
            "Building Batch #" +
              batchNumber +
              1 +
              ":" +
              batchRecipients.slice(0, -11)
          );
          recipientsProcessed++;
          if (batchMaker == 99 || listComplete == recipientsProcessed) {
            console.log(batchRecipients.slice(0, -11));
            var subjectLineRaw = document.getElementById("subject").value;
            var messageBodyRaw = document.getElementById("body").value;
            const subjectLine = subjectLineRaw.replace(/(\r\n|\n|\r)/gm, " ");
            const messageBody = messageBodyRaw.replace(/(\r\n|\n|\r)/gm, " ");
            var data =
              `{
                "to": "` +
              JSON.stringify(batchRecipients.slice(0, -11)) +
              `",
                "title": "` +
              subjectLine +
              `",
                "body": "` +
              messageBody +
              `",
                "sound": "default"
              }`;
            console.log(data);

            var xhr = new XMLHttpRequest();
            var url =
              "url goes here";
            xhr.open("POST", url);
            xhr.setRequestHeader("accept", "application/json");
            xhr.setRequestHeader("content-type", "application/json");

            xhr.onreadystatechange = function () {
              if (xhr.readyState === 4) {
                console.log(xhr.status);
                console.log(xhr.responseText);
              }
            };
            // console.log(data);
            console.log(xhr);
            xhr.send(data);
            console.log(
              "Push Notification POST batch #" + ++batchNumber + "complete!"
            );
            batchMaker = 0;
          }
        }
      }

我似乎不明白为什么我会被困住,但我的直觉是关于“for”和“if”语句的标准,或者我的计数器“batchMaker”的重置" 在我的 "if" 语句末尾为 0。

在调试模式下,设置各种断点时,只要 batchMaker = 50,我的“if”语句中的所有内容都不会执行,除了再次重置 batchMaker = 0 ......这当然会终止我的循环。在“for”或“if”语句中设置条件,使 batchMaker 不相同 for (batchMaker = 0; batchMaker < 99; batchMaker++)if (batchMaker == 99 || listComplete == recipientsProcessed)... 例如如果两者都不是 99,我会得到一个无限循环的控制台日志,并且仍然没有执行 POST 请求......我觉得我很接近,但也许我的方法有缺陷。感谢您的帮助!

我想通了。在下面添加另一个“计数器”机制 batchCounter,修改和 if 条件以使用这个新的 batchCounter 而不是相同的 batchMaker,然后重置此 [=11] 的值=] 变量,以便每个后续 loop/batch batchCounterbatchMaker 的交互与它们在第一个循环中所做的相同(即在遇到 'if' 之前 batchMaker == batchCounter +1语句条件),最后在 recipientsProcessed 开始处理 'undefined' 时完全打破循环,这是我的数组中的 non-existence 索引号,在代码中显示为 listComplete + 1 == recipientsProcessed .这是当前按预期工作的完整更新代码片段:

        var pageSelecterRadioButton = document.querySelector(
          'input[name="page_selecter"]:checked'
        );
        var pageSelected = pageSelecterRadioButton.value;
        var listComplete = allRecipients.length;
        var batchCounter = 0;
        var batchMaker = 0;
        var batchRecipients;
        var batchNumber = 0;
        var recipientsProcessed = 0;
        for (batchMaker = 0; batchMaker < 99; batchMaker++) {
          batchRecipients =
            allRecipients[recipientsProcessed] + `","` + batchRecipients;
          console.log(
            "Building Batch #" +
              (batchNumber + 1) +
              ':"' +
              batchRecipients.slice(0, -11)
          );
          batchCounter++;
          recipientsProcessed++;
          if (batchCounter == 99 || listComplete == recipientsProcessed) {
            console.log(`"` + batchRecipients.slice(0, -11));
            var subjectLineRaw = document.getElementById("subject").value;
            var messageBodyRaw = document.getElementById("body").value;
            const subjectLine = subjectLineRaw.replace(/(\r\n|\n|\r)/gm, " ");
            const messageBody = messageBodyRaw.replace(/(\r\n|\n|\r)/gm, " ");
            var data =
              `{
                "to": ["` +
              batchRecipients.slice(0, -11) +
              `],
                "title": "` +
              subjectLine +
              `",
                "body": "` +
              messageBody +
              `",
                "sound": "default",
                "data": {"event": "` +
              pageSelected +
              `"}
              }`;
            console.log(data);

            var xhr = new XMLHttpRequest();
            var url =
              "https://stormy-peak-86652.herokuapp.com/https://exp.host/--/api/v2/push/send";
            xhr.open("POST", url);
            xhr.setRequestHeader("accept", "application/json");
            xhr.setRequestHeader("content-type", "application/json");

            xhr.onreadystatechange = function () {
              if (xhr.readyState === 4) {
                console.log(xhr.status);
                console.log(xhr.responseText);
              }
            };
            console.log(data);
            console.log(xhr);
            xhr.send(data);
            console.log(
              "Push Notification POST batch #" + ++batchNumber + "complete!"
            );
            batchCounter = 2;
            batchMaker = 0;
            var batchRecipients = "         ";
          }
          if (listComplete + 1 == recipientsProcessed) {
            alert(recipientsProcessed - 1 + " Push Notifications Sent!");
            break;
          }
        }
      }

上面的代码片段中还添加了一些其他内容,但没有真正涉及这里的问题(添加了处理单选按钮值的任务,并在 HTTP Post 中输入了其他内容,等等.).希望有一天这对其他人有所帮助!