JSON PHP
การใช้งานทั่วไปของ JSON คือการอ่านข้อมูลจากเว็บเซิร์ฟเวอร์ และแสดงข้อมูลในหน้าเว็บ
บทนี้จะสอนวิธีแลกเปลี่ยนข้อมูล JSON ระหว่างไคลเอนต์และเซิร์ฟเวอร์ PHP
ไฟล์ PHP
PHP มีฟังก์ชันในตัวเพื่อจัดการ JSON
ออบเจ็กต์ใน PHP สามารถแปลงเป็น JSON ได้โดยใช้ฟังก์ชัน PHP json_encode() :
ไฟล์ PHP
<?php
$myObj->name = "John";
$myObj->age = 30;
$myObj->city = "New
York";
$myJSON = json_encode($myObj);
echo $myJSON;
?>
JavaScript ไคลเอ็นต์
นี่คือ JavaScript บนไคลเอนต์ โดยใช้การเรียก AJAX เพื่อขอไฟล์ PHP จากตัวอย่างด้านบน:
ตัวอย่าง
ใช้ JSON.parse() เพื่อแปลงผลลัพธ์เป็นวัตถุ JavaScript:
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const myObj = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myObj.name;
}
xmlhttp.open("GET", "demo_file.php");
xmlhttp.send();
PHP Array
อาร์เรย์ใน PHP จะถูกแปลงเป็น JSON ด้วยเมื่อใช้ฟังก์ชัน PHP json_encode() :
ไฟล์ PHP
<?php
$myArr = array("John", "Mary", "Peter", "Sally");
$myJSON = json_encode($myArr);
echo $myJSON;
?>
JavaScript ไคลเอ็นต์
นี่คือ JavaScript บนไคลเอนต์ โดยใช้การเรียก AJAX เพื่อขอไฟล์ PHP จากตัวอย่างอาร์เรย์ด้านบน:
ตัวอย่าง
ใช้ JSON.parse() เพื่อแปลงผลลัพธ์เป็นอาร์เรย์ JavaScript:
var xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const myObj = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myObj[2];
}
xmlhttp.open("GET", "demo_file_array.php", true);
xmlhttp.send();
ฐานข้อมูล PHP
PHP เป็นภาษาโปรแกรมฝั่งเซิร์ฟเวอร์ และสามารถใช้เพื่อเข้าถึงฐานข้อมูลได้
ลองนึกภาพว่าคุณมีฐานข้อมูลบนเซิร์ฟเวอร์ของคุณ และคุณต้องการส่งคำขอไปยังฐานข้อมูลจากไคลเอนต์ที่คุณขอ 10 แถวแรกในตารางที่เรียกว่า "ลูกค้า"
บนไคลเอนต์ สร้างวัตถุ JSON ที่อธิบายจำนวนแถวที่คุณต้องการส่งคืน
ก่อนที่คุณจะส่งคำขอไปยังเซิร์ฟเวอร์ ให้แปลงวัตถุ JSON เป็นสตริงและส่งเป็นพารามิเตอร์ไปยัง URL ของหน้า PHP:
ตัวอย่าง
ใช้ JSON.stringify() เพื่อแปลงวัตถุ JavaScript เป็น JSON:
const limit = {"limit":10};
const dbParam = JSON.stringify(limit);
xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
document.getElementById("demo").innerHTML = this.responseText;
}
xmlhttp.open("GET","json_demo_db.php?x=" + dbParam);
xmlhttp.send();
ตัวอย่างอธิบาย:
- กำหนดวัตถุที่มีคุณสมบัติและค่า "จำกัด"
- แปลงวัตถุเป็นสตริง 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");
$stmt = $conn->prepare("SELECT name FROM customers LIMIT ?");
$stmt->bind_param("s", $obj->limit);
$stmt->execute();
$result = $stmt->get_result();
$outp = $result->fetch_all(MYSQLI_ASSOC);
echo json_encode($outp);
?>
ไฟล์ PHP อธิบาย:
- แปลงคำขอเป็นวัตถุโดยใช้ฟังก์ชัน PHP json_decode( )
- เข้าถึงฐานข้อมูลและกรอกข้อมูลในอาร์เรย์ด้วยข้อมูลที่ร้องขอ
- เพิ่มอาร์เรย์ไปยังวัตถุ และส่งกลับวัตถุเป็น JSON โดยใช้ฟังก์ชันjson_encode()
ใช้ข้อมูล
ตัวอย่าง
xmlhttp.onload = function() {
const myObj = JSON.parse(this.responseText);
let text = "";
for (let x in myObj) {
text += myObj[x].name + "<br>";
}
document.getElementById("demo").innerHTML = text;
}
วิธี PHP = POST
เมื่อส่งข้อมูลไปยังเซิร์ฟเวอร์ วิธีที่ดีที่สุดคือใช้POST
วิธี HTTP
หากต้องการส่งคำขอ AJAX โดยใช้POST
วิธีการ ให้ระบุวิธีการและส่วนหัวที่ถูกต้อง
ข้อมูลที่ส่งไปยังเซิร์ฟเวอร์ในตอนนี้ต้องเป็นอาร์กิวเมนต์ของsend()
เมธอด:
ตัวอย่าง
const dbParam = JSON.stringify({"limit":10});
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const myObj = JSON.parse(this.responseText);
let text ="";
for (let x in myObj) {
text += myObj[x].name + "<br>";
}
document.getElementById("demo").innerHTML = text;
}
xmlhttp.open("POST", "json_demo_db_post.php");
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");
$stmt = $conn->prepare("SELECT name FROM customers LIMIT ?");
$stmt->bind_param("s",
$obj->limit);
$stmt->execute();
$result = $stmt->get_result();
$outp = $result->fetch_all(MYSQLI_ASSOC);
echo json_encode($outp);
?>