Send JSON data from Javascript to PHP?

by

I’ve gotten lots of information here so I wanted to post a solution I discovered.

The problem: Getting JSON data from Javascript on the browser, to the server, and having PHP successfully parse it.

Environment: Javascript in a browser (Firefox) on Windows. LAMP server as remote server: PHP 5.3.2 on Ubuntu.

What works (version 1):
1) JSON is just text. Text in a certain format, but just a text string.

2) In Javascript, var str_json = JSON.stringify(myObject) gives me the JSON string.

3) I use the AJAX XMLHttpRequest object in Javascript to send data to the server:

request= new XMLHttpRequest()
request.open("POST", "JSON_Handler.php", true)
request.setRequestHeader("Content-type", "application/json")
request.send(str_json)
[... code to display response ...]

4) On the server, PHP code to read the JSON string:

$str_json = file_get_contents('php://input');

This reads the raw POST data. $str_json now contains the exact JSON string from the browser.

What works (version 2):
1) If I want to use the "application/x-www-form-urlencoded" request header, I need to create a standard POST string of "x=y&a=b[etc]" so that when PHP gets it, it can put it in the $_POST associative array. So, in Javascript in the browser:

var str_json = "json_string=" + (JSON.stringify(myObject))

PHP will now be able to populate the $_POST array when I send str_json via AJAX/XMLHttpRequest as in version 1 above.

Displaying the contents of $_POST['json_string'] will display the JSON string. Using json_decode() on the $_POST array element with the json string will correctly decode that data and put it in an array/object.

The pitfall I ran into:
Initially, I tried to send the JSON string with the header of application/x-www-form-urlencoded and then tried to immediately read it out of the $_POST array in PHP. The $_POST array was always empty. That’s because it is expecting data of the form yval=xval&[rinse_and_repeat]. It found no such data, only the JSON string, and it simply threw it away. I examined the request headers, and the POST data was being sent correctly.

Similarly, if I use the application/json header, I again cannot access the sent data via the $_POST array. If you want to use the application/json content-type header, then you must access the raw POST data in PHP, via php://input, not with $_POST.

References:
1) How to access POST data in PHP: How to access POST data in PHP?
2) Details on the application/json type, with some sample objects which can be converted to JSON strings and sent to the server: http://www.ietf.org/rfc/rfc4627.txt

More Related Contents:

  1. How to pass an array using PHP & Ajax to Javascript?
  2. Writing JSON object to .json file on server
  3. the facebooks 'xyz is typing' feature? [closed]
  4. How to inject javascript code that uses php variables into php page
  5. Calling a php script at the end of a js script
  6. Call php function from JavaScript
  7. How to get the jQuery $.ajax error response text?
  8. Simple jQuery, PHP and JSONP example?
  9. PHP json_encode encoding numbers as strings
  10. Passing JavaScript array to PHP through jQuery $.ajax
  11. Send array with Ajax to PHP script
  12. The holy grail of cleaning input and output in php?
  13. Creating jQuery AJAX requests to a PHP function
  14. JavaScript: How do I create JSONP?
  15. Change DIV content using ajax, php and jQuery
  16. jQuery AJAX form using mail() PHP script sends email, but POST data from HTML form is undefined
  17. Best way to transfer an array between PHP and Javascript [duplicate]
  18. Submitting JSON data via JQuery ajax.post to PHP
  19. Scaling a chat app – short polling vs. long polling (AJAX, PHP)
  20. jQuery $.ajax request of dataType json will not retrieve data from PHP script
  21. Jquery: Running AJAX locally without a webserver
  22. json parse error with double quotes
  23. How to download a file on clicking the name of file using PHP?
  24. uploading a file via ajax with php
  25. SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
  26. show progressbar while loading pages using jquery ajax in single page website
  27. How to keep form values after post [duplicate]
  28. I want a pagination to my options page of wordpress plugin?
  29. Detect Ajax calling URL
  30. How to return an array from an AJAX call?

Leave a Comment