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

Question

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

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

这是一个 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 时。感谢您的帮助..

Answer 1

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

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

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

   const config = {
     responseType: 'text'
   }
   

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

4. 凭直觉，如果您正在使用类似的东西

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

   那么你需要把它改成

   <form @submit.prevent="postData">
   

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

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

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

6. 假设在您的 PHP 中一切正常，$postBody 将是 stdclass 的一个实例，json_decode() 的结果。尝试 echo 不会很好地工作。事实上，它将trigger an error喜欢

   Recoverable fatal error: Object of class stdClass could not be converted to string

   但是你的报错等级可能没有设置正确，你看不到。参见 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。