JSON 服務器

JSON 的一個常見用途是與 Web 服務器交換數據。

從 Web 服務器接收數據時，數據始終是字符串。

用 JSON.parse() 解析數據，數據會成為 JavaScript 對象。

發送 Data

如果您將數據存儲在 JavaScript 對象中，則可以將對象轉換為 JSON，并將其發送到服務器：

實例

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

親自試一試

接收 Data

如果您接收 JSON 格式的數據，則可以輕松地將其轉換為 JavaScript 對象：

實例

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

親自試一試

來自服務器的 JSON

您可以使用 AJAX 請求從服務器請求 JSON

只要來自服務器的響應以 JSON 格式編寫，您就可以將字符串解析為 JavaScript 對象。

實例

使用 XMLHttpRequest 從服務器獲取數據：

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