JavaScript Tutorial

Serveur JSON


Une utilisation courante de JSON consiste à échanger des données vers/depuis un serveur Web.

Lors de la réception de données d’un serveur Web, les données sont toujours une chaîne.

Analyser les données avec JSON.parse()et les données deviennent un objet JavaScript.


Envoi de données

Si vous avez des données stockées dans un objet JavaScript, vous pouvez convertir l’objet en JSON et l’envoyer à un serveur :

Exemple

const myObj = {nom : “John”, âge : 31, ville : “New York”} ;
const monJSON = JSON.stringify(monObj);
window.location = “demo_json.php?x=” + monJSON ;

Essayez-le vous-même »


Réception de données

Si vous recevez des données au format JSON, vous pouvez facilement les convertir en objet JavaScript :

Exemple

const myJSON = ‘{“name”:”John”, “age”:31, “city”:”New York”}’ ;
const monObj = JSON.parse(monJSON);
document.getElementById(“demo”).innerHTML = myObj.name;

Essayez-le vous-même »


JSON à partir d’un serveur

Vous pouvez demander JSON au serveur en utilisant une requête AJAX

Tant que la réponse du serveur est écrite au format JSON, vous pouvez analyser la chaîne dans un objet JavaScript.

Exemple

Utilisez XMLHttpRequest pour obtenir des données du serveur :

const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = fonction() {
const myObj = JSON.parse(this.responseText);
document.getElementById(“demo”).innerHTML = myObj.name;
} ;
xmlhttp.open(“GET”, “json_demo.txt”);
xmlhttp.send();

Essayez-le vous-même »

Jetez un oeil à json_demo.txt



Tableau en tant que JSON

Lors de l’utilisation du JSON.parse() sur JSON dérivé d’un tableau, la méthode renverra un tableau JavaScript, au lieu d’un objet JavaScript.

Exemple

JSON renvoyé par un serveur sous forme de tableau :

const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = fonction() {
const myArr = JSON.parse(this.responseText);
document.getElementById(“demo”).innerHTML = myArr[0];
}
}
xmlhttp.open(“GET”, “json_demo_array.txt”, true);
xmlhttp.send();

Essayez-le vous-même »

Jetez un oeil à json_demo_array.txt

#Serveur #JSON

Related Articles

Back to top button