无法使用post方法在AJAX调用中发送数据

Question

这是我的代码，它非常简单并且可以完美地工作：

var r = new XMLHttpRequest();
var name='KillerSeba';
r.open("GET","../Serve/servepage.php?name="+name,true);
r.onreadystatechange = function () {
  if (r.readyState != 4 || r.status != 200) return;
  alert("Success: " + r.responseText);
};
r.send();

此代码仅在页面加载时发送警报“成功：KillerSeba”。 而且我的php文件可以回答请求，看起来有点：

<?php
$s=$_REQUEST['name'];
echo $s;
?>

然后，我想使用POST方法而不是GET之一。 为此，我将“ GET”更改为“ POST”，将url更改为php文件，然后将名称变量添加到send（）函数，因此我的JavaScript代码如下所示：

var r = new XMLHttpRequest();
var name='KillerSeba';
r.open("POST","../Serve/servepage.php",true);
r.onreadystatechange = function () {
  if (r.readyState != 4 || r.status != 200) return;
  alert("Success: " + r.responseText);
};
r.send(name);

但是现在脚本没有将任何数据发送到php文件，因为我只收到“成功：”警报。 KillerSeba消散到某个地方。 我试图在send（）函数中使用'name'和“ name”而不是name，但我尝试用$ _POST替换$ _REQUEST，但仍然无济于事。 所以我的问题是：如何使用POST方法在AJAX请求中发送数据？ send（）函数如何工作？ PS我更喜欢仅使用Vanilla JS Framework。

Answer 1

您正在发送name但没有任何变量名（它被视为没有任何值的变量名）。

更改您的r.send(name); 到r.send('name=' + name); 。

有关更多信息，请查看MDN Web文档

编辑：感谢您的提示，当然您需要在发送请求之前设置适当的标头：

r.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

Answer 2

由于您要以字符串形式发送名称而没有任何参数，这就是为什么它不适用于POST方法，但是当您使用GET发送时，您会将名称与url连接在一起的原因。 现在，您必须以与GET方法发送相同的方式传递参数 。 就像这样尝试，我只是将名称包装到一个名为params的变量中，该变量包含params = 'name='+name; 因此，您必须使用r.send(params)来发送它。 请参阅此处的GET和POST示例

var r = new XMLHttpRequest();
var name='KillerSeba';
r.open("POST","../Serve/servepage.php",true);
//Send the proper header information along with the request
r.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
r.onreadystatechange = function () {
  if (r.readyState != 4 || r.status != 200) return;
  alert("Success: " + r.responseText);
};
params = 'name='+name;
r.send(params);