Axios发送POST请求后PHP无法正确获取$_POST数据的解决方法

我用Axios写了一个POST请求函数：

function loadData(interfaceName) {
    axios({
        method: 'POST',
        url: '<?= (isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? 'https' : 'http') . "://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]" ?>',
        data: {
            interface: interfaceName,
        },
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        }
    }).then(function (response) {
        document.getElementById('statistics').innerHTML = JSON.stringify(response.data);
    });
}

PHP端接收代码是这样的：

require_once __DIR__ . '/../vendor/autoload.php';
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    header('Content-Type: application/json');
    dd($_POST);
    print_r($_POST);
    exit;
}

现在的问题是，发送请求后PHP的$_POST是空的，没法正确获取到POST数据，请问该怎么解决？

嘿，我来帮你捋捋这个问题：你设置了Content-Type: application/x-www-form-urlencoded，但Axios默认不会把data里的对象自动转换成表单格式的键值对（比如interface=xxx）——它还是会以JSON格式发送数据。而PHP的$_POST只会自动解析符合application/x-www-form-urlencoded或multipart/form-data规范的请求体，所以自然拿不到数据。

给你两个可行的解决办法：

办法一：让Axios正确发送表单格式数据 #

用URLSearchParams包装你的请求数据，Axios就会按照表单格式发送了：

function loadData(interfaceName) {
    const params = new URLSearchParams();
    params.append('interface', interfaceName);
    
    axios({
        method: 'POST',
        url: '<?= (isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? 'https' : 'http') . "://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]" ?>',
        data: params,
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        }
    }).then(function (response) {
        document.getElementById('statistics').innerHTML = JSON.stringify(response.data);
    });
}

修改后，请求体就会变成interface=xxx的格式，PHP的$_POST['interface']就能正常读取到值了。如果你项目里有qs库，也可以用qs.stringify({interface: interfaceName})来替换URLSearchParams，效果是一样的。

办法二：PHP端直接解析JSON请求体 #

要是不想改前端代码，也可以在PHP端读取原始请求体，手动解析JSON：

require_once __DIR__ . '/../vendor/autoload.php';
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    header('Content-Type: application/json');
    // 读取原始的POST请求体
    $rawPostData = file_get_contents('php://input');
    // 把JSON字符串解析成关联数组
    $postData = json_decode($rawPostData, true);
    
    // 现在就能用$postData['interface']获取到值了
    dd($postData);
    print_r($postData);
    exit;
}

不过这里要提一句，规范上来说，前端的Content-Type应该和实际发送的数据格式匹配——如果用这个办法，建议把前端的Content-Type改成application/json，这样更严谨。

内容的提问来源于stack exchange，提问作者Isa Eken