JSON PHP

Obsah

Běžným použitím JSON je čtení dat z webového serveru, a zobrazit data na webové stránce.

Tato kapitola vás naučí, jak mezi sebou vyměňovat data JSON klienta a PHP serveru.

Soubor PHP

PHP má některé vestavěné funkce pro zpracování JSON.

Objekty v PHP lze převést na JSON pomocí funkce PHP json_encode():

soubor PHP

 <?php
$myObj->name = "John";
$myObj->age = 30;
$myObj->city = "New 
  York";
$myJSON = json_encode($myObj);
echo $myJSON;
?>

JavaScript klienta

Zde je JavaScript na klientovi pomocí volání AJAX k vyžádání PHP soubor z výše uvedeného příkladu:

Příklad

Pomocí JSON.parse() převeďte výsledek na objekt 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();

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Get JSON Data from a PHP Server</h2>
<p id="demo"></p>

<script>
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();
</script>

</body>
</html>

Pole PHP

Pole v PHP budou také převedeny na JSON při použití funkce PHP json_encode():

soubor PHP

 <?php
$myArr = array("John", "Mary", "Peter", "Sally");
$myJSON = json_encode($myArr);
echo $myJSON;
?>

JavaScript klienta

Zde je JavaScript na klientovi pomocí volání AJAX k vyžádání PHP soubor z příkladu pole výše:

Příklad

Pomocí JSON.parse() převeďte výsledek do pole 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();

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Get JSON Data from a PHP Server</h2>
<p>Convert the data into a JavaScript array:</p>
<p id="demo"></p>

<script>
const 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");
xmlhttp.send();
</script>

</body>
</html>

Databáze PHP

PHP je programovací jazyk na straně serveru a lze jej použít pro přístup k databázi.

Představte si, že máte na svém serveru databázi a chcete na ni odeslat požadavek to z klienta, kde požadujete prvních 10 řádků v tabulce s názvem „zákazníků“.

Na klientovi vytvořte objekt JSON, který popisuje počty řádků, které chcete vrátit.

Před odesláním požadavku na server převeďte objekt JSON na a řetězec a odešlete jej jako parametr na adresu URL stránky PHP:

Příklad

Pomocí JSON.stringify() převeďte objekt JavaScriptu na 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();

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Get JSON Data from a PHP Server</h2>
<p>The JSON received from the PHP file:</p>

<p id="demo"></p>

<script>
const dbParam = JSON.stringify({"limit":10});

const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
  document.getElementById("demo").innerHTML = this.responseText;
}
xmlhttp.open("GET", "json_demo_db.php?x=" + dbParam);
xmlhttp.send();
</script>

</body>
</html>

Vysvětlený příklad:

Definujte objekt obsahující vlastnost a hodnotu "limit".
Převeďte objekt na řetězec JSON.
Odešlete požadavek do souboru PHP s řetězcem JSON jako parametrem.
Počkejte, až se požadavek vrátí s výsledkem (jako JSON)
Zobrazte výsledek přijatý ze souboru PHP.

Podívejte se na soubor PHP:

soubor 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);
?>

Vysvětlení souboru PHP:

Převeďte požadavek na objekt pomocí funkce PHP json_decode().
Vstupte do databáze a vyplňte pole požadovanými údaji.
Přidejte pole do objektu a vraťte objekt jako JSON using funkce json_encode().

Použijte Data

Příklad

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;
}

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Get JSON Data from a PHP Server</h2>
<p id="demo"></p>

<script>
const obj = { "limit":10 };
const dbParam = JSON.stringify(obj);
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
  myObj = JSON.parse(this.responseText);
  let text = ""
  for (let x in myObj) {
    text += myObj[x].name + "<br>";
  }
  document.getElementById("demo").innerHTML = text;
};
xmlhttp.open("GET", "json_demo_db.php?x=" + dbParam);
xmlhttp.send();
</script>

<p>Try changing the "limit" property from 10 to 5.</p>

</body>
</html>

Metoda PHP=POST

Při odesílání dat na server je často nejlepší použít HTTP metodu POST.

Chcete-li odesílat požadavky AJAX pomocí metody POST, zadejte metodu a správné záhlaví.

Data odeslaná na server musí být nyní argumentem metody send():

Příklad

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);

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Use HTTP POST to Get JSON Data from a PHP Server</h2>

<p id="demo"></p>

<script>
const dbParam = JSON.stringify({"limit":10});
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
  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);
</script>

<p>Try changing the "limit" property from 10 to 5.</p>

</body>
</html>

Jediný rozdíl v souboru PHP je způsob získávání přenesených dat.

soubor PHP

Použijte $_POST místo $_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);
?>