Я передаю переменную javascript в php, используя сообщение метода fetch API, но в файле php я получаю сообщение об ошибке: неопределенный ключ массива «данные». Как это исправить?
------html код -------
<html>
<body>
<textarea id = "my-textarea"> </textarea>
<button onclick = "_post_text_area_()" id = "submit-btn">Submit</button>
</body>
<html>
------код javascript------
# get value of textarea
var textarea = document.getElementById("my-textarea");
function _post_text_area_() {
var data = textarea.value;
# show textarea value to console
console.info(data);
# pass data variable using fetch api POST method
fetch('_process.php', {
method: 'POST',
body: 'data=' + data
})
.then(function (response) {
return response.text();
})
.then(function (data) {
console.info(data);
});
}
--- _process.php ---
<?php
$data = $_POST['data'];
echo "Received data: " . $data;
?>
Я получаю сообщение об ошибке в файле _process.php: Неопределенный ключ массива «данные». Я думаю, что получаю эту ошибку, потому что моя функция javascript не может создать почтовый запрос, но я не знаю точной причины, по которой я получаю эту ошибку.
Я пробовал другую технику, например ajax XmlHttpRequest, для передачи переменной данных в файл _process.php, но получил ту же ошибку.
var textarea = document.getElementById("my-textarea");
var submitBtn = document.getElementById("submit-btn");
submitBtn.addEventListener("click", function() {
var data = textarea.value;
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
console.info(this.responseText); // Print the response from the server
}
};
xmlhttp.open("POST", "process.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("data = " + data);
});
«Неопределенный массив «данные»» или «Неопределенный ключ массива «данные»»?
@brombee это не проблема. В моем вопросе была ошибка. Теперь я изменил свой вопрос. Спасибо за ваши комментарии. Теперь вы видите, как правильно понимаете мой вопрос.
@fusion3k я получаю эту ошибку: Неопределенный ключ массива «данные» в файле php. Я получаю эту ошибку в $data = $_POST['data'];
Вы уже смотрели на FormData?
@ChrisHaas Да, сэр, я пытался использовать FormData, но все еще не могу решить свою проблему.
Ответы 2
Обычно предпочтительнее использовать FormData при создании полезной нагрузки для отправки через fetch — следующее действительно отправляет запрос AJAX, но не работает из-за ограничений песочницы.
const d=document;
d.addEventListener('click',e=>{
if ( e.target instanceof HTMLButtonElement && e.target.id=='submit-btn' ){
let fd=new FormData();
fd.set('data', d.getElementById("my-textarea").value );
fetch('_process.php', {method:'post',body:fd })
.then(r=>r.text())
.then(console.info)
.catch(alert)
}
});<textarea id = "my-textarea"></textarea>
<button id = "submit-btn">Submit</button>Тот же код, который был первоначально опубликован, будет работать только в том случае, если вы правильно установите тип контента. По этой причине переменная $_POST была оставлена пустой.
Вы можете изменить свою команду fetch на следующую версию:
fetch('_process.php', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: 'data=' + data
})
.then(...)
...
Или вы можете использовать тип контента application/json в своей команде fetch:
fetch('_process.php', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: 'data=' + data
})
.then(...)
...
... и в вашем PHP вместо того, чтобы полагаться на объект $_POST, вы делаете следующее:
<?php
$postedData = json_decode(file_get_contents('php://input'), true);
$data = $postedData['data'];
echo "Received data: " . $data;
document.getElementById("my-textarea")с этимidэлемента нет. Выconsole.infoсвойdataвидели, что в нем содержится? Вы использовали вкладку DevTools/Network вашего браузера, чтобы увидеть, что отправляется/возвращается?