How to capture json data on php that is sent with ajax (no jquery)

Question

I am sending a json data to the server using ajax and pure javascript. How do I get the $_POST index that will display the json content on the php page?

ajax send a request as key=value to the server, meanwhile, by using the content-type 'application/json', I got an example on the link below as the json data (stringfy) was sent directly with no key=value.

Sending a JSON to server and retrieving a JSON in return, without JQuery

On the php side for post request, the example below was given.

$v = json_decode(stripslashes(file_get_contents("php://input")))

Now i don't understand what php://input signifies here since the json data was sent to the same page. I tried file_get_contents('https://'.$_SERVER['SERVER_NAME'].$_SERVER['PHP_SELF']); but it returned nothing. I tried using var_dump($_POST) to view all the content as an array, but all i get is array(0){}. So how do i actually catch the ajax (json) request i sent to a php page? Here is an example of the code:

var data = {
    name : "john",
    Friend : "Jonny",
    Bestie : "johnson",
    neighbour: "john doe"
};
json = JSON.stringify(data);
    var ajax = new XMLHttpRequest(), url = '../handler.php';
    ajax.onreadystatechange = function() {
        if(this.readyState == 4 && this.status == 200) {
            console.log(this.responseText);
        };
    };
    ajax.open('POST', url, true);
    ajax.setRequestHeader('content-type', 'application/json');
    ajax.send(json);

PHP

header("Content-Type: application/json");
var_dump($_POST); 
file_get_contents('https://'.$_SERVER['SERVER_NAME'].$_SERVER['PHP_SELF']);

I expected the json string to be present in the $_POST variable and accessible by it's index after decoding the json string, but i get array(0){}, null or nothing displayed at all

try without stringify, and also check under network tab, your request, what is send in content — Ahmed Sunny, Feb 03 '19 at 15:38
Based on the way you are sending the data, I believe that the data is part of the body and not the `POST`, so try grabbing the body of the request instead. — Get Off My Lawn, Feb 03 '19 at 15:53
@AhmedSunny, I've tried that, without stringfy, the data being sent to the server is [object object] and still the same result. — Uchenna Ajah, Feb 03 '19 at 15:56
@GetOffMyLawn, I don't understand clearly what you mean by the _the data is part of the body and not the POST_ . How do I grab the body of the request? — Uchenna Ajah, Feb 03 '19 at 15:58
You should be able to get it like this: `$inputJSON = file_get_contents('php://input'); $input = json_decode($inputJSON);` — Get Off My Lawn, Feb 03 '19 at 16:01

CoursesWeb · Accepted Answer · 2019-02-04T07:33:08.240

1

To get an array, add the true argument to json_decode(). In your code:

$body = json_decode(file_get_contents("php://input"), true);
var_export($body);

To add the JSON data in $_POST, you can use this code.

In JS:

json = JSON.stringify(data);
var ajax = new XMLHttpRequest(), url = '../handler.php';
ajax.onreadystatechange = function() {
  if(this.readyState == 4 && this.status == 200) {
    console.log(this.responseText);
  };
};
ajax.open('POST', url, true);
ajax.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
ajax.send('jsn='+json);

In PHP:

$arr = isset($_POST['jsn']) ? json_decode($_POST['jsn'], true) :[];
var_export($arr);

Source: https://coursesweb.net/ajax/json-from-javascript-php

edited Feb 04 '19 at 07:33

answered Feb 03 '19 at 16:01

CoursesWeb

4,179
3
21
27

I think i just found a new protocol `php://input` and I'll take time to know more about it. It worked. Thank you very much coursesWeb. – Uchenna Ajah Feb 03 '19 at 16:12
@UchennaAjah [Here is a list](http://php.net/manual/en/wrappers.php.php) – Get Off My Lawn Feb 03 '19 at 16:15

How to capture json data on php that is sent with ajax (no jquery)

1 Answers1