JSON-server
Een veelgebruikt gebruik van JSON is het uitwisselen van gegevens van/naar een webserver.
Bij het ontvangen van gegevens van een webserver zijn de gegevens altijd een string.
Parseer de gegevens met JSON.parse(), en de gegevens worden een JavaScript-object.
Gegevens verzenden
Als u gegevens hebt opgeslagen in een JavaScript-object, kunt u het object converteren naar JSON en naar een server sturen:
Voorbeeld
const myObj = {name: "John",
age: 31, city: "New York"};
const myJSON =
JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;
Data ontvangen
Als u gegevens in JSON-indeling ontvangt, kunt u deze eenvoudig converteren naar een JavaScript-object:
Voorbeeld
const myJSON =
'{"name":"John",
"age":31, "city":"New York"}';
const myObj =
JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;
JSON vanaf een server
U kunt JSON van de server aanvragen met behulp van een AJAX-verzoek
Zolang het antwoord van de server in JSON-indeling is geschreven, kunt u de tekenreeks ontleden in een JavaScript-object.
Voorbeeld
Gebruik de XMLHttpRequest om gegevens van de server op te halen:
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const myObj = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myObj.name;
};
xmlhttp.open("GET", "json_demo.txt");
xmlhttp.send();
Kijk eens op json_demo.txt
Array als JSON
Bij gebruik van de JSON.parse()op JSON afgeleid van een array, retourneert de methode een JavaScript-array in plaats van een JavaScript-object.
Voorbeeld
JSON geretourneerd van een server als een array:
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const myArr = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myArr[0];
}
}
xmlhttp.open("GET", "json_demo_array.txt", true);
xmlhttp.send();
Kijk eens naar json_demo_array.txt