多个 xmlhttprequestes 不向后端发送数据

Question

我是 xmlhttprequests 的新手，所以请多多包涵。我正在尝试制作一个记录用户按键并将其发送到服务器以将其保存到 .txt 文件的程序，但它不起作用。问题是 JavaScript 端没有将数据发送到服务器端。是不是不允许向同一个服务器地址发送多个请求？我哪里做错了？我在我的代码中添加了注释以帮助更好地理解。

JavaScript:

var keylog = {
  // (A) SETTINGS & PROPERTIES
  cacheW: [], // TEMP STORAGE FOR KEY PRESSES
  cacheA: [],
  cacheD: [],
  cacheS: [],
  delay: 500, // HOW OFTEN TO SEND DATA TO SERVER
  sending: false, // ONLY 1 UPLOAD ALLOWED AT A TIME

  // (B) INITIALIZE
  init: function() {
    // (B1) CAPTURE KEY STROKES
    window.addEventListener("keydown", function(evt) {
      if (evt.key == "w") {
        keylog.cacheW.push(evt.key);
        //console.log("this: " + evt.key)
      } else if (evt.key == "a") {
        keylog.cacheA.push(evt.key);
        //console.log("this: " + evt.key)
      } else if (evt.key == "d") {
        keylog.cacheD.push(evt.key);
        //console.log("this: " + evt.key)
      } else if (evt.key == "s") {
        keylog.cacheS.push(evt.key);
        //console.log("this: " + evt.key)
      }

    });

    window.addEventListener("keyup", function(evt) {
      if (evt.key == "w") {
        keylog.cacheW.push("!" + evt.key);
        //console.log("this: " + evt.key + " removed")
      } else if (evt.key == "a") {
        keylog.cacheA.push("!" + evt.key);
        //console.log("this: " + evt.key + " removed")
      } else if (evt.key == "d") {
        keylog.cacheD.push("!" + evt.key);
        //console.log("this: " + evt.key + " removed")
      } else if (evt.key == "s") {
        keylog.cacheS.push("!" + evt.key);
        //console.log("this: " + evt.key + " removed")
      }

    });

    // (B2) SEND KEYSTROKES TO SERVER
    window.setInterval(keylog.send, keylog.delay);
  },

  // (C) AJAX SEND KEYSTROKES
  send: function() {
    if (!keylog.sending && keylog.cacheW.length != 0) {
      // (C1) "LOCK" UNTIL THIS BATCH IS SENT TO SERVER
      keylog.sending = true;

      // (C2) W KEYPRESS DATA
      var dataW = new FormData();
      dataW.append("keysW", keylog.cacheW);
      keylog.cacheW = []; // CLEAR KEYS

      // (C2) A KEYPRESS DATA
      var dataA = new FormData();
      dataA.append("keysA", keylog.cacheA);
      keylog.cacheA = []; // CLEAR KEYS

      // (C2) D KEYPRESS DATA
      var dataD = new FormData();
      dataD.append("keysD", keylog.cacheD);
      keylog.cacheD = []; // CLEAR KEYS

      // (C2) S KEYPRESS DATA
      var dataS = new FormData();
      dataS.append("keysS", keylog.cacheS);
      keylog.cacheS = []; // CLEAR KEYS

      // (C3) AJAX SEND
      var xhrW = new XMLHttpRequest();
      xhrW.open("POST", "index4.php");
      xhrW.onload = function() {
        keylog.sending = false; // UNLOCK
        //console.log(this.response); 
      };

      var xhrA = new XMLHttpRequest();
      xhrA.open("POST", "index4.php");
      xhrA.onload = function() {
        keylog.sending = false; // UNLOCK
        //console.log(this.response); 
      };

      var xhrD = new XMLHttpRequest();
      xhrD.open("POST", "index4.php");
      xhrD.onload = function() {
        keylog.sending = false; // UNLOCK
        //console.log(this.response);
      };

      var xhrS = new XMLHttpRequest();
      xhrS.open("POST", "index4.php");
      xhrS.onload = function() {
        keylog.sending = false; // UNLOCK
        //console.log(this.response);
      };

      xhrW.send(dataW);
      xhrA.send(dataA);
      xhrD.send(dataD);
      xhrS.send(dataS);
    }
  }
};
window.addEventListener("DOMContentLoaded", keylog.init);

<?php
$keysW = $_POST['keysW'];
$keysA = $_POST['keysA'];
$keysD = $_POST['keysD'];
$keysS = $_POST['keysS'];

$keylogW = 'player2KeylogW.txt';
$writeKeylogW = fopen($keylogW, "w") or die("Unable to open file!");

fwrite($writeKeylogW, json_encode($keysW));
fclose($writeKeylogW);

$keylogA = 'player2KeylogA.txt';
$writeKeylogA = fopen($keylogA, "w") or die("Unable to open file!");

fwrite($writeKeylogA, json_encode($keysA));
fclose($writeKeylogA);

$keylogD = 'player2KeylogD.txt';
$writeKeylogD = fopen($keylogD, "w") or die("Unable to open file!");

fwrite($writeKeylogD, json_encode($keysD));
fclose($writeKeylogD);

$keylogS = 'player2KeylogS.txt';
$writeKeylogS = fopen($keylogS, "w") or die("Unable to open file!");

fwrite($writeKeylogS, json_encode($keysS));
fclose($writeKeylogS);

chmod($keylogW , 0755);
chmod($keylogA , 0755);
chmod($keylogD , 0755);
chmod($keylogS , 0755); 
?>

Answer 1

快速查看您的 JS 代码，以下行：

if (!keylog.sending && keylog.cacheW.length != 0) {
   ...
}

... 仅当 keylog.sending 标志为 false 且之前按下“W”键时才会发送数据（按下任何其他键都无效因此，不会发送任何数据）。

您可能还想修改“发送”代码以匹配官方文档中显示的代码：https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send#example_post

多个 xmlhttprequestes 不向后端发送数据

Multiple xmlhttprequestes not sending data to back-end

javascript

php

xmlhttprequest