无法接收 Vue 通过 axios 发送到 PHP 的 Post 数据

Posted 2023-02-22

【中文标题】无法接收 Vue 通过 axios 发送到 PHP 的 Post 数据

【英文标题】：Cannot recieve Post data sent from Vue via axios to PHP

【发布时间】：2019-08-28 12:55:22

【问题描述】：

开发者。我正在运行本地 apache 服务器。有静态 Vue 文件和带有一些脚本的“打印”文件夹。我正在尝试从 Vue（通过 axios）向“打印”文件夹发送 http 请求。

我尝试使用 vue-resource 发送数据，但我遇到了同样的问题。

这是一个 Vue 方法：

postData: function() 
      const data = 
        firstName: "John",
        lastName: "Doe"
      ;
      const config = 
        headers: 
          "Content-Type": "application/x-www-form-urlencoded"
        
      ;
      axios
        .post("/print", data, config)
        .then(function(response) 
          console.log(response);
        )
        .catch(function(error) 
          console.log(error);
        );
    

打印文件夹中的 index.php 文件：

<?php
$postBody = file_get_contents("php://input");
$postBody = json_encode($postBody);
echo 'Post: ',$postBody, ' here';

以下是网络标签中的一些屏幕截图（质量问题，请见谅） 我不确定为什么 devtools 将请求视为 GET，但我使用 POST

当我将响应记录到控制台时，它看起来像这样。这里的响应实际上是 POST。但数据仍然缺失。

“预览”选项卡看起来像这样。

请求实际上到达了文件，但$postBody 只是一个空字符串。我猜问题是("php://input") 没有得到任何输入。当echo count($_POST) 0 返回时。感谢您的帮助..

【问题讨论】：

您的屏幕截图显示了对/print 的GET 请求，但您使用的是axios.post。那没有意义。你确定你使用你的postData方法来触发请求吗

这很奇怪。是的，肯定会使用 postData。当我在控制台中记录响应时，它显示该方法实际上是 POST。可能问题出在开发工具中。

json_encode() 在你的 PHP 中应该是 json_decode()。请参阅下面的答案

这是表单中的按钮吗？如果是这样，请参阅我的答案中关于添加“.prevent”事件修饰符的注释

非常感谢@Phil。这很奇怪，但是问题出在目录地址上。输入 /print 时发出 GET 请求。将其更改为/print/index.php 后，一切正常并发出 POST 请求。 @Phil，编辑添加这一点的答案，我会将答案打勾为正确答案。在你的提示之后，我学到了很多东西。上帝保佑你..

【参考方案1】：

这里有几个问题我会按顺序解决。

您发送的是 JSON，而不是 application/x-www-form-urlencoded，因此请删除 Content-type 请求标头。 axios 默认为application/json

默认情况下，Axios 期望响应为 JSON，但您的 PHP 脚本以纯文本响应。将您的 config 更改为

const config = 
  responseType: 'text'

您在应该使用json_decode() 的地方使用json_encode()。前者将 PHP 数据结构转换为 JSON 格式的字符串。后者则相反。

如果你正在使用类似的东西

<form @submit="postData" action="/print">

那你需要改成

<form @submit.prevent="postData">

防止表单正常提交。如果您使用带有@click 处理程序的表单提交按钮，情况也是如此。或者使用type="button"，这样它就不会默认提交。

见https://vuejs.org/v2/guide/events.html#Event-Modifiers

您的网络服务器可能正在执行从/print 到/print/index.php 的重定向，从而将您的POST 请求转换为GET。为确保不会发生这种情况，请使用 URL 中的完整路径。

假设在您的 PHP 中一切正常，$postBody 将是stdclass 的一个实例，json_decode() 的结果。尝试echo 不会很好地工作。其实会trigger an error点赞

可恢复的致命错误：stdClass 类的对象无法转换为字符串

但您的错误报告级别可能未正确设置以供您查看。见How to get useful error messages in PHP?

如果您只想重新显示 JSON，请尝试

$postBody = json_decode(file_get_contents('php://input')); // returns a stdclass
echo 'Post: ', json_encode($postBody), ' here';

请注意，由于您的 "Post: " and " here" 输出，响应将不是有效的 JSON。

【讨论】：

感谢您的回答。我设置了error_reporting=E_ALL，但仍然没有显示任何消息。我想问题在于(php://input) 根本没有任何内容。我将不胜感激进一步的建议:)

@АдильханСатемиров 检查浏览器的 Network 控制台。找到 AJAX 请求并检查请求标头和正文。在您的问题中发布一些屏幕截图

@АдильханСатемиров，如果你想在 PHP 输出中看到错误，你需要display_errors=On。如果您要更改 php.ini

，也不要忘记重新启动 Apache