Не удается получить данные Post, отправленные из Vue через axios в PHP

Question

дэвы.Я использую локальный сервер Apache.Есть статические файлы Vue и папка «print» с некоторым скриптом.Я пытаюсь отправить http-запрос из Vue (через axios) в папку «print».

Я пытался использовать 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.Но данные все еще отсутствуют.

Вкладка Prview выглядит следующим образом.

Запрос фактически достигает файла, но $postBody просто пустоестрока.Я думаю, проблема в том, что ("php://input") не получает никакого ввода.Когда echo count($_POST) 0 возвращается.Спасибо за любую помощь ..

Answer 1

Здесь есть пара проблем, которые я рассмотрю по порядку.

1. Вы отправляете JSON, а не application/x-www-form-urlencoded, поэтому удалите заголовок запроса Content-type. По умолчанию 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://vuejs.org/v2/guide/events.html#Event-Modifiers

5. Ваш веб-сервер может выполнять перенаправление с /print на /print/index.php, преобразуя ваш запрос POST в GET. Чтобы этого не произошло, используйте полный путь в своем URL.

6. Предполагая, что в вашем PHP все работает, $postBody будет экземпляром stdclass, результатом json_decode(). Попытка сделать это echo не будет очень хорошей. Фактически, это вызовет ошибку как

   Исправимая фатальная ошибка: объект класса stdClass не может быть преобразован в строку

   но ваш уровень сообщений об ошибках может быть установлен неправильно для вас, чтобы увидеть. См. Как получить полезные сообщения об ошибках в PHP?

   Если вы просто хотите снова показать JSON, попробуйте

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

   Обратите внимание, что ответ не будет действительным JSON из-за ваших "сообщений:" и "здесь" выходных данных.