Axios发布的参数不是由$ _POST读取的

Question

所以我有这个代码:

axios({
    method: 'post',
    url,
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    data: {
        json,
        type,
    }   
})  

最初我有正常axios.post但我改变了这个,因为我认为它可能是一个标题问题.但是我仍然没有检测,我$_REQUEST也没有$_POST.但是,它正在接收数据file_get_contents("php://input").

知道什么是错的吗？

编辑

好吧,我想我知道什么是错的.它将它作为json对象发布,因此只能在php://输入中读取.如何在axios中将其更改为普通字符串？

Answer 1

从文档中(我没有保留引用材料中的链接):

使用application/x-www-form-urlencoded格式

默认情况下,axios将JavaScript对象序列化为JSON.要以application/x-www-form-urlencoded格式发送数据,您可以使用以下选项之一.

浏览器

在浏览器中,您可以使用URLSearchParams API,如下所示:

var params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params); 

请注意,所有浏览器都不支持URLSearchParams,但有一个polyfill可用(确保填充全局环境).

或者,您可以使用qs库对数据进行编码:

var qs = require('qs');
axios.post('/foo', qs.stringify({ 'bar': 123 }));

Answer 2

var params = {
    data1: 'string',
}

axios.post(url, params).then(function(response) {
    //code here 
});

要么

axios.post(url, {data1: 'string' }).then(function(response) {
    //code here 
});

API

$_POST = json_decode(file_get_contents("php://input"),true);
echo $_POST['data1'];

Answer 3

如果您决定在AJAX库或服务器语言之间切换，则使事情变得更容易和通用。随着axios使用原生JS FormData。
如果你有一个对象中的数据，你可以将它转换成FormData这样：

var myDataObj = {id:1, name:"blah blah"}
var formData = new FormData();


for (var key in myDataObj) {
    formData.append(key, myDataObj[key])
}

然后你发送数据：

axios.post('/sub/process.php', formData, {
    params: { action: "update-user" },
    headers: { 'Content-Type': 'multipart/form-data' },
    baseURL: 'http://localhost',
}).then(data =>
    console.log(data)
).catch(err => {
    console.log(err)
    return null
})

请注意，您还可以使用paramsin发送一些信息axios，您可以使用$_GET. 另请注意，我使用的是 baseURL，以防您为网页和 API 端点使用不同的服务器。
您还需要了解，在axios发送真正的请求之前，它会执行一个preflight请求。预检请求是浏览器在 CORS 中的一种机制，用于检查资源目的地是否愿意接受真正的请求。毕竟，当目标主机无论如何都不愿意接收时，为什么要发送请求？

您必须确保您的服务器具有适用于您的 axios 请求的正确标头，否则预检请求将检测到不兼容并停止您的请求：

//this is if you are using different different origins/servers in your localhost, * to be update with the right address when it comes to production
header('Access-Control-Allow-Origin: *');
//this is if you are specifying content-type in your axios request
header("Access-Control-Allow-Headers: Content-Type");

现在，您将能够访问$_POST变量中发送的数据：

echo "<pre>";
print_r($_POST);
echo "</pre>";

此外，axios 允许您以不同格式发送数据。你可以像这样发送一个json：

axios.post('/sub/process.php', { id: "1", name:"blablah" }, {
    params: { action: "update-item" },
    headers: { 'Content-Type': 'application/json' },
    baseURL: 'http://localhost',
}).then(data =>
    console.log(data)
).catch(err => {
    console.log(err)
    return null
})

在PHP端，可以这样访问：

$data = json_decode(file_get_contents("php://input"),true);
echo "<pre>";
print_r($data);
echo "</pre>";

Answer 4

使用 PHP std 对象

使用 PHP std 对象结构来获取帖子的变量。

在客户端：

axios.post(url, {id: 1 , Name:'My Name' }).then(function(response) {
    console.log(response.data);
});

在服务器上

$obj = json_decode(file_get_contents('php://input'));   
$id = $obj->id;
$Name = $obj->Name;    

//test by returning the same values
$retObj=(object)["id"=>$id,"Name"=>$Name]
echo json_encode($retObj);

jQuery 和 Axios 使用相同的 PHP 文件

如果您有一个文件从 axios 和 jquery 接收帖子，您可以使用：

if($_SERVER['REQUEST_METHOD']==='POST' && empty($_POST)) {
   $_POST = json_decode(file_get_contents('php://input'),true); 
}

将 Axios json 序列化的帖子转换为 $_POST 数组