JSON PHP

JSON 的常規用途是從 web 服務器讀取數據,然后在網頁中顯示這些數據。

本章向您講解如何在客戶端與 PHP 服務器之間交換 JSON 數據。

PHP 文件

PHP 提供處理 JSON 的內建函數。

通過使用 PHP 函數 json_encode(),PHP 中的對象可轉換為 JSON:

PHP 文件

<?php
$myObj->name = "Bill Gates";
$myObj->age = 62;
$myObj->city = "Seattle";
$myJSON = json_encode($myObj);
echo $myJSON;
?>

顯示 PHP 文件

客戶端 JavaScript

這是客戶端上的 JavaScript,使用 AJAX 調用來請求上例的 PHP 文件:

實例

使用 JSON.parse() 把結果轉換為 JavaScript 對象:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function()  {
    if (this.readyState == 4 && this.status == 200) {
         myObj = JSON.parse(this.responseText);
         document.getElementById("demo").innerHTML = myObj.name;
     }
};
xmlhttp.open("GET", "demo_file.php", true);
xmlhttp.send();

親自試一試

PHP 數組

在使用 PHP 函數 json_encode() 時,PHP 中的數組也將被轉換為 JSON:

PHP 文件

<?php
$myArr = array("Bill Gates", "Steve Jobs", "Elon Musk");
$myJSON = json_encode($myArr);
echo $myJSON;
?>

顯示 PHP 文件

客戶端 JavaScript

這是客戶端上的 JavaScript,使用 AJAX 調用來請求上例的 PHP 文件:

實例

請使用 JSON.parse() 將結果轉換為 JavaScript 數組:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function()  {
    if (this.readyState == 4 && this.status == 200) {
         myObj = JSON.parse(this.responseText);
         document.getElementById("demo").innerHTML = myObj[2];
     }
};
xmlhttp.open("GET", "demo_file_array.php", true);
xmlhttp.send();

親自試一試

PHP 數據庫

PHP 是服務器端編程語言,應該用于只能由服務器執行的操作,比如訪問數據庫。

想象一下服務器上有一個數據庫,包含客戶、產品和供應商數據。

此刻,您需要請求服務器來獲取“客戶”表中前十條記錄:

實例

請使用 JSON.stringify() 將 JavaScript 對象轉換為 JSON:

obj = { "table":"customers", "limit":10 };
dbParam = JSON.stringify(obj);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
     if (this.readyState == 4 && this.status == 200) {
        document.getElementById("demo").innerHTML  = this.responseText;
    }
};
xmlhttp.open("GET",  "demo_json_db.php?x=" + dbParam, true);
xmlhttp.send();

親自試一試

例子解釋:

  • 定義包含 table 屬性和 limit 屬性的對象。
  • 將這個對象轉換為 JSON 字符串。
  • 向這個 PHP 文件發送請求,其中 JSON 作為參數。
  • 等待直到請求返回結果(作為 JSON)。
  • 顯示從 PHP 文件接收到的結果。

查看 PHP 文件

PHP 文件

<?php
header("Content-Type: application/json; charset=UTF-8");
$obj =  json_decode($_GET["x"], false);
$conn = new mysqli("myServer", "myUser", "myPassword", "Northwind");
$result = $conn->query("SELECT name FROM ".$obj->$table." LIMIT ".$obj->$limit);
$outp = array();
$outp = $result->fetch_all(MYSQLI_ASSOC);
echo json_encode($outp);
?>

PHP 文件解釋:

  • 將請求轉換為對象,使用 PHP 函數 json_decode()
  • 訪問數據庫,用所請求的數據填充數組。
  • 把數組添加到對象,使用 json_encode() 函數以 JSON 返回該對象。

遍歷結果

把從 PHP 文件接收到的結果轉換為 JavaScript 對象,或者是在本例中的,一個 JavaScript數組:

實例

使用 JSON.parse() 把 JSON 轉換為 JavaScript 對象:

...
xmlhttp.onreadystatechange = function() {
     if (this.readyState == 4 && this.status == 200) {
         myObj = JSON.parse(this.responseText);
         for (x in myObj) {
             txt += myObj[x].name + "<br>";
        }
         document.getElementById("demo").innerHTML = txt;
    }
};
 ...

親自試一試

PHP 方法 = POST

在向服務器發送數據時,通常最好是使用 HTTP POST 方法。

如需使用 POST 方法來發送 AJAX 請求,請指定該方法和正確的頭部。

發送到服務器的數據現在必須是 .send() 方法的參數:

實例

obj = { "table":"customers", "limit":10 };
dbParam = JSON.stringify(obj);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
     if (this.readyState == 4 && this.status == 200) {
         myObj = JSON.parse(this.responseText);
         for (x in myObj) {
             txt += myObj[x].name + "<br>";
        }
         document.getElementById("demo").innerHTML = txt;
    }
};
xmlhttp.open("POST", "demo_json_db.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("x=" + dbParam);

親自試一試

PHP 文件中的唯一不同是獲取被傳輸數據的方法。

PHP 文件

使用 $_POST 而不是 $_GET

<?php
header("Content-Type: application/json; charset=UTF-8");
$obj =  json_decode($_POST["x"], false);
$conn = new mysqli("myServer", "myUser", "myPassword", "Northwind");
$result = $conn->query("SELECT name FROM ".$obj->$table." LIMIT ".$obj->$limit);
$outp = array();
$outp = $result->fetch_all(MYSQLI_ASSOC);
echo json_encode($outp);
?>