Вот файл data.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="data.php" method="post" onsubmit="return submitHandler(this);">
<input type="text" name="name" placeholder="Имя">
<input type="number" name="age" placeholder="Возраст">
<button>Оправить</button>
<output></output>
</form>
<script>
function submitHandler(form) {
var dataToSend = {};
for(const [key, value] of new FormData(form)) {
dataToSend[key] = value;
}
fetch(form.action, {
method: form.method,
body: JSON.stringify(dataToSend)
})
.then(function(response) { return response.json(); })
.then(function(data) {
form.querySelector("output").textContent = `
Получено от сервера:
Имя: ${data.name},
возраст: ${data.age}
`;
})
.catch(function(data) {
form.querySelector("output").textContent = `
Нет ответа от сервера!
`;
})
;
return false;
}
</script>
</body>
</html>
Вот файл data.php
<?php
$str = file_get_contents('php://input');
$data = json_decode($str);
header('Content-Type: application/json; charset=utf-8');
echo json_encode($data);
поместите их в одну папку, которая доступна публично на вашем сервере, который работает с PHP. Откройте файл data.html с сервера (если у вас папка публично доступна по адресу
https://example.com/, то это будет
https://example.com/data.html)
Заполните форму, отправьте, ответ от сервера появится рядом! Исследуйте код!
UPD Ваше лукошко что-то не пингуется, что бы это значило?
|
Код:
|
~/Desktop/img is 📦 v1.0.0 via ⬢ v10.15.3 via 🐘 v7.0.33 took 27m 18s
➜ ping korzinka.byethost9.com
PING korzinka.byethost9.com (185.27.134.139) 56(84) bytes of data. |
А такое...
|
Код:
|
~/Desktop/img is 📦 v1.0.0 via ⬢ v10.15.3 via 🐘 v7.0.33
➜ tracepath korzinka.byethost9.com |
завершается так...
|
Код:
|
11: ae-3-3.bear1.Manchesteruk2.Level3.net 109.038ms asymm 12
12: no reply
13: no reply
14: no reply
15: no reply
16: WILDCARD-UK.bear1.Manchesteruk2.Level3.net 108.867ms !H
Resume: pmtu 1500 |