Meet JSON

A l’heure où l’AJAX commençait à signer les belles heures de l’Internet dynamique depuis l’émergence du web 2.0, s’est posée la question de l’échange de données entre scripts. En effet, si le web de papa se contentait de rafraîchir la page à chaque requête pour en afficher le résultat, dès lors, il fallait que la page à l’origine de la requête puisse traiter son retour directement, de façon transparente et sans escale.

Avec la montée en puissance de JQuery, le chargement dans une div locale d’un fragment de HTML généré par un script serveur appelé en AJAX est devenu la nouvelle marotte du web qui va vite. Mais petit à petit, le web s’est rendu plus applicatif, et plutôt que de retourner du HTML stérile, le besoin de recevoir directement le lot de datas requises, pour leur appliquer un traitement à postériori côté client s’est vite fait sentir.

Demander et recevoir des données structurées, c’est une problématique bien ancienne qui a trouvé ses formats et normes bien avant l’apparition du premier Nyan Cat. XML en est une belle illustration. Mais le problème de XML pour le web, c’est qu’il n’est pas lu directement par le navigateur, ni le serveur. Ses données doivent préalablement être parsées pour pouvoir être utilisée. Pour (entre autres) s’affranchir de cette ENOOOORME contrainte et d’un code structuré parfois un peu trop massif, est né JSON.

JSON (à l’américaine djèyesseunne), pour JavaScript Object Notation, est un format de données stockées à plat dans un fichier texte sous forme d’une chaîne de caractère dont la syntaxe permet de représenter des datas structurées (ou non).

Dérivé de la notation JavaScript, JSON se veut un format universel d’échanges de données entre deux langages de programmation. Il est facile à lire et à écrire par des humains, donc à fortiori par des machines. Ses principaux avantages sont :

• sa syntaxe : à base de “,”, “:”, “{“, “[“, elle est à portée du développeur le plus feignant, lisible à l’oeil et plus light que le XML.
• son format : il permet de représenter tout type de données (entier, chaîne, booléen, tableau, objet…)
• son universalité et portabilité : n’importe quel langage ou environnement sachant gérer du texte peut l’utiliser

Et sinon en vrai ça donne quoi ?

Voici notre première rencontre avec l’objet JSON, et comme tout objet JSON, on lui fait une belle accolade :

{mon objet JSON}

Ensuite on fait connaissance avec lui au travers des paires key:value qu’il contient :

{user_id:1,name:”Jason”, age:24, hobbies:[“le hockey”,”les couteaux”, “la forêt”],serial_killer:true, amis: null}

Les différentes valeurs représentent explicitement : texte, entier, valeurs booléennes ou nulles. Mais elles peuvent également elles-mêmes être d’un type objet {} ou tableau []. Et ainsi de suite, les valeurs du tableau, par exemple, peuvent elles-mêmes être de type simple ou structuré, permettant ainsi une imbrication de données sur plusieurs niveaux.

Si notre fichier contient une liste d’éléments, on pourra le remplir comme suit :

{users:[{user_id:1,name:”Jason”, age:24, hobbies:[“le hockey”,”les couteaux”, “la forêt”],serial_killer:true, amis: null},{user_id:2,name:”Freddy”, age:26, hobbies:[”les griffes”, “les pulls rayés”],serial_killer:true, amis: null}]}

Ça vous fait penser à une déclaration JavaScript ? Et ben oui c’est aussi simple que ça !

Et ton truc, la, j’en fais quoi ?

En JavaScript :

Vous récupérez votre chaîne de texte d’une manière ou d’une autre (callback AJAX, lecture d’un fichier…) dans une variable myJSONtext.

Ensuite un appel à la fonction eval() permet de transformer notre chaîne en objet JavaScript :

var myJSONObject = eval(‘(‘ + myJSONtext + ‘)’);

On peut alors parcourir l’objet et accéder aux différentes clés et valeurs :

console.log(user[0].name); // Jason

console.log(user[1].hobbies[0]); // les griffes

La fonction eval(), native, est bien pratique, mais si vous n’êtes pas sûr de l’innocuité de ce que vous récupérez, préférez un parseur JSON dédié, qui évitera tout code malicieux d’être exécuté via le eval(). Oui, j’avais dit plus haut que JSON n’avait pas besoin d’une librairie extérieure pour être parsé, et ça reste vrai puisque le recours au parseur n’est qu’un choix de sécurité non obligatoire, et qu’en plus les navigateurs récents en embarquent un. La création de notre Objet devient alors :

var myJSONObject = JSON.parse(myJSONtext);

A l’inverse, si vous voulez retourner une chaîne JSON d’une variable javascript :

var myJSobject = {user_id:1,name:”Jason”, age:24, hobbies:[“le hockey”,”les couteaux”, “la forêt”],serial_killer:true, amis: null};

var myJSONtext = JSON.stringify(myJSobject);

En PHP :

Depuis PHP 5.2, les fonctions json_encode() et json_decode() sont disponibles pour manipuler très facilement ce format. Elles fonctionnent avec une profondeur d’imbrication (tableau dans un tableau dans un tableau…) de 512 par défaut.

Vous recevez des datas JSON que votre script PHP doit traiter ? Utilisez json_decode() pour récupérer une variable PHP représentant l’objet.

Votre script PHP doit retourner des datas pour un callback AJAX ? Utilisez json_encode() pour formater votre sortie JSON. Le callback pourra alors évaluer le retour et utiliser les données récupérées.
Au final, sans révolutionner l’Internet, JSON apporte une réponse simple et satisfaisante à la problématique du formatage des données échangées entre scripts et constitue, à moindre frais, un véritable pont entre langages. Il n’a pour autant pas totalement volé la vedette à XML, format déjà bien installé, disposant de bon nombre d’outils de parsing et d’édition, et aussi moins exigeant quant à l’usage des simples et doubles quotes dans sa syntaxe. D’autant que, comme on n’arrête pas le progrès, la relève est déjà en route avec des formats tels que MessagePack qui promet de tailler à la hache le poids des fichiers en le décharnant de 30% grâce à une syntaxe codifiée.

Découvrez d’autres articles sur le développement : Framework PHP et NodeJS