I am using fetch api to interact with server. I am trying to send data to server. my front end code looks like this:
<!DOCTYPE html>
<html>
<head>
<title> Fetch Testing </title>
</head>
<body>
<button id = "add"> Add </button>
<script>
document.getElementById("add").addEventListener("click", function(){
var options = {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({name: "george", email: "george@g.com"})
};
fetch("get.php",options)
.then(function(response){
console.log(response);
});
});
</script>
</body>
</html>
And my server side code (called "get.php") looks like this:
<?php
echo var_dump($_POST);
?>
So as you can see I am sending json with properties name and email and their values but it seems that nothing is sent to server because printing the response gives null json and null text.
Problem was in header, in Content-type I should have written
application/x-www-form-urlencoded;
instead of
application/json
Set the responded heading to json get.php:
header('Content-Type: application/json');
echo json_encode($_POST);