Le format JSON permet de représenter des données, il est beaucoup utilisé pour l’échange d’informations. De la même manière qu’avec le XML, les données sont structurées et typées.

Il est possible très facilement de renvoyer du JSON en PHP avec la fonction json_encode, de récupérer ces données en Ajax pour les manipuler en JavaScript puis les afficher en HTML à l’utilisateur.

A savoir, par défaut une requête cross-domain (entre 2 domaines différents) échouera pour des raisons de sécurité.

Avec la deuxième version du XHR, il est possible d’y parvenir en ajoutant un entête Access-Control-Allow-Origin côté serveur, qui permet de spécifier un ou plusieurs domaines autorisés à appeler la ressource.

Exemple en PHP :

header('Access-Control-Allow-Origin: http://site-de-confiance.com');

Fonctionnement avec JSONP

Il est possible de renvoyer les données au format JSONP, en encapsulant celles-ci dans une fonction callback.

Concrètement, voici ce qu’on aura côté client, avec une requête Ajax effectuée en jQuery :

$.ajax({
    url: 'http://serveur.com/api/json',
    type: 'GET',
    jsonpCallback: 'callback',
    dataType: 'jsonp',
    success: function(data) { console.log(data); },
    error: function() { alert('bazinga!'); }
});

Et côté serveur, la page qui présente les données :

$data = array('foo' => 'bar');
if (isset($_GET['callback'])) {
    header('Content-type: application/json; charset=UTF-8');
    echo $_GET['callback'] . '(' . json_encode($data) . ')';
}

Voila un exemple simple et fonctionnel pour effectuer une requête cross-domain avec le format JSONP.