Есть файл index.php с html-кодом, в котором форма с некоторыми input-ми:
<div id="vueArea" class="body">
<form @submit="onSubmit" method="POST" action="/files/server.php">
<!--Какая-то html-вёрска c input-ми и {{vue-переменными}}-->
<button type="submit" class="button"'>Получить результат</button>
</form>
</div>
<script src="/files/script.js"></script>
Далее файл /files/script.js с функцией onSubmit, которая срабатывает при нажатии на кнопку:
new Vue({
el: '#vueArea',
methods: {
async onSubmit() {
let formData = new FormData();
formData.append("name", "value");
await axios.post("/files/server.php", formData)
.then((response) => {
console.log('SUCCESS!!');
console.log(response.data);
})
.catch(function () {
console.log('FAILURE!!');
})
})
И файл /files/server.php, на котором я пытаюсь обратиться к массиву $_POST:
<?php
declare(strict_types=1);
var_dump($_POST);
?>
Запускаю приложение на localhost:8080
При нажатии на кнопку открывается страница файла /files/server.php, где var_dump($_POST); выводит массив только с теми данными, которые есть в форме в тегах input, а переменных из js файла ("name" => "value" в данном случае) в нём нет. В исходном коде страницы, в консоли выводится сообщение FAILURE!!, то есть, срабатывает блок catch.
Если к событию onSubmit добавить модификатор prevent (), запретив этим перезагрузку страницы (файл /files/server.php не открывается, остаёмся на index.php), то в исходном коде, в консоли выводится сообщение SUCCESS!! и
массив axios.post запроса, то есть данные из него отправлены.
Перепробовал всё, что только можно. Отправлял данные и в JSON формате:
axios.post("/files/server.php",
{
data: {
"name": "value"
},
headers: {'content-type': 'application/x-www-form-urlencoded'},
})
.then( (response) => {
console.log('SUCCESS!!');
console.log(response.data);
})
.catch(function () {
console.log('FAILURE!!');
})
Принимая их в /files/server.php из
php://input так:
try {
$data = json_decode(file_get_contents('php://input'), true, 512, JSON_THROW_ON_ERROR);
} catch (JsonException $e) {
echo $e;
}
var_dump(file_get_contents('php://input'));
Здесь json_decode выбрасывает исключение, кстати:
JsonException: Syntax error in C:\Users\"имя пк"\Desktop\Work\repo\task_calculator\files\server.php:10
Stack trace:
#0 C:\Users\"имя пк"\Desktop\Work\repo\task_calculator\files\server.php(10): json_decode()
А var_dump($data); выводит NULL
Но в файле
php://input всё те же данные из form html при открытии /files/server.php, что и раньше, данных axios нет, в консоли FAILTURE!!. Аналогично первому примеру с модификатором .prevent, в консоли выведет SUCCESS!! и нужный массив(только в формате JSON), отправленный через axios.post.
Резюмирую: нужно при нажатии кнопки перейти на страницу /files/server.php, в котором получить доступ к данным из axios.post, данные из form html в принципе не нужны
Уже почти неделю пытаюсь это решить, всё перепробовал. Помогите пожалуйста!