What is JSON?
JSON stands for JavaScript Object Notation, and is a syntax for storing and exchanging data.
Since the JSON format is a text-based format, it can easily be sent to and from a server, and used as a data format by any programming language.
PHP and JSON
PHP has some built-in functions to handle JSON.
First, we will look at the following two functions:
- json_encode[]
- json_decode[]
PHP - json_encode[]
The json_encode[] function is used to encode a value to JSON format.
Example
This example shows how to encode an associative array into a JSON object:
Run Example »
Example
This example shows how to encode an indexed array into a JSON array:
Run Example »
PHP - json_decode[]
The json_decode[] function is used to decode a JSON object into a PHP object or an associative array.
Example
This example decodes JSON data into a PHP object:
Run Example »
The json_decode[] function returns an object by default. The json_decode[] function has a second parameter, and when set to true, JSON objects are decoded into associative arrays.
Example
This example decodes JSON data into a PHP associative array:
Run Example »
PHP - Accessing the Decoded Values
Here are two examples of how to access the decoded values from an object and from an associative array:
Example
This example shows how to access the values from a PHP object:
Run Example »
Example
This example shows how to access the values from a PHP associative array:
Run Example »
PHP - Looping Through the Values
You can also loop through the values with a foreach[] loop:
Example
This example shows how to loop through the values of a PHP object:
Run Example »
Example
This example shows how to loop through the values of a PHP associative array:
Run Example »
A common use of JSON is to read data from a web server, and display the data in a web page.
This chapter will teach you how to exchange JSON data between the client and a PHP server.
The PHP File
PHP has some built-in functions to handle JSON.
Objects in PHP can be converted into JSON by using the PHP function json_encode[]:
PHP file
Show PHP file »
The Client JavaScript
Here is a JavaScript on the client, using an AJAX call to request the PHP file from the example above:
Example
Use JSON.parse[] to convert the result into a JavaScript object:
const xmlhttp = new XMLHttpRequest[];
xmlhttp.onload =
function[] {
const myObj = JSON.parse[this.responseText];
document.getElementById["demo"].innerHTML = myObj.name;
}
xmlhttp.open["GET", "demo_file.php"];
xmlhttp.send[];
Try it Yourself »
PHP Array
Arrays in PHP will also be converted into JSON when using the PHP function json_encode[]:
PHP file
Show PHP file »
The Client JavaScript
Here is a JavaScript on the client, using an AJAX call to request the PHP file from the array example above:
Example
Use JSON.parse[] to convert the result into a JavaScript array:
var xmlhttp = new XMLHttpRequest[];
xmlhttp.onload = function[] {
const myObj = JSON.parse[this.responseText];
document.getElementById["demo"].innerHTML = myObj[2];
}
xmlhttp.open["GET", "demo_file_array.php", true];
xmlhttp.send[];
Try it Yourself »
PHP Database
PHP is a server side programming language, and can be used to access a database.
Imagine you have a database on your server, and you want to send a request to it from the client where you ask for the 10 first rows in a table called "customers".
On the client, make a JSON object that describes the numbers of rows you want to return.
Before you send the request to the server, convert the JSON object into a string and send it as a parameter to the url of the PHP page:
Example
Use JSON.stringify[] to convert the JavaScript object into JSON:
const limit = {"limit":10};
const dbParam = JSON.stringify[limit];
xmlhttp = new XMLHttpRequest[];
xmlhttp.onload = function[] {
document.getElementById["demo"].innerHTML = this.responseText;
}
xmlhttp.open["GET","json_demo_db.php?x=" + dbParam];
xmlhttp.send[];
Try it Yourself »
Example explained:
- Define an object containing a "limit" property and value.
- Convert the object into a JSON string.
- Send a request to the PHP file, with the JSON string as a parameter.
- Wait until the request returns with the result [as JSON]
- Display the result received from the PHP file.
Take a look at the PHP file:
PHP file
PHP File explained:
- Convert the request into an object, using the PHP function json_decode[].
- Access the database, and fill an array with the requested data.
- Add the array to an object, and return the object as JSON using the json_encode[] function.
Use the Data
Example
xmlhttp.onload = function[] {
const myObj = JSON.parse[this.responseText];
let text = "";
for [let x in myObj] {
text += myObj[x].name + "
";
}
document.getElementById["demo"].innerHTML
= text;
}
Try it Yourself »
PHP Method = POST
When sending data to the server, it is often best to use the HTTP POST
method.
To send AJAX requests using the POST
method, specify the method, and the correct header.
The data sent to the server must now be an argument to the send[]
method:
Example
const dbParam =
JSON.stringify[{"limit":10}];
const xmlhttp = new XMLHttpRequest[];
xmlhttp.onload = function[] {
const myObj = JSON.parse[this.responseText];
let text ="";
for [let x in myObj] {
text += myObj[x].name + "
";
}
document.getElementById["demo"].innerHTML = text;
}
xmlhttp.open["POST", "json_demo_db_post.php"];
xmlhttp.setRequestHeader["Content-type", "application/x-www-form-urlencoded"];
xmlhttp.send["x=" + dbParam];
Try it Yourself »
The only difference in the PHP file is the method for getting the transferred data.
PHP file
Use $_POST instead of $_GET: