JSON Server

Een veelvoorkomende toepassing van JSON is het uitwisselen van gegevens met een webserver.

Bij het ontvangen van gegevens van een webserver zijn gegevens altijd een string.

Met JSON.parse() Parseer gegevens, gegevens worden een JavaScript-object.

Verstuur Data

Als u gegevens opslaat in een JavaScript-object, kunt u het object omzetten in JSON en het naar de server sturen:

实例

const myObj = {name: "Bill", age: 31, city: "New York"};
const myJSON = JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;

亲自试一试

Ontvang Data

Als u gegevens in JSON-formaat ontvangt, kunt u deze gemakkelijk omzetten in een JavaScript-object:

实例

const myJSON = '{"name":"Bill", "age":31, "city":"New York"}';
const myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;

亲自试一试

JSON van de server

U kunt een AJAX-verzoek gebruiken om JSON van de server op te vragen

Zolang de respons van de server in JSON-formaat is geschreven, kunt u de string omzetten in een JavaScript-object.

实例

Gebruik XMLHttpRequest om gegevens van de server te verkrijgen:

const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
  const myObj = JSON.parse(this.responseText);
  document.getElementById("demo").innerHTML = myObj.name;
};
xmlhttp.open("GET", "json.txt");
xmlhttp.send();

亲自试一试

请参见：json.txt

数组形式的 JSON

在从数组派生的 JSON 上使用 JSON.parse() 时，该方法会返回 JavaScript 数组，而不是 JavaScript 对象。

实例

从服务器以数组返回的 JSON：

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

亲自试一试

请参见：json_array.txt