JSONP

فهرست مطالب

نمایش فهرست مطالب

JSONP ﯼﺎﻫ ﻩﺩﺍﺩ ﻝﺎﺳﺭﺍ ﯼﺍﺮﺑ ﯽﺷﻭﺭ JSON ﺖﺳﺍ ﻪﻨﻣﺍﺩ ﻦﯿﺑ ﺕﻼﮑﺸﻣ ﺩﺭﻮﻣ ﺭﺩ ﯽﻧﺍﺮﮕﻧ ﻥﻭﺪﺑ.

JSONP ﯽﺷ ﺯﺍ XMLHttpRequest ﺪﻨﮐ ﯽﻤﻧ ﻩﺩﺎﻔﺘﺳﺍ.

JSONP ﮓﺗ ﺯﺍ ﻥﺁ ﯼﺎﺟ ﻪﺑ <script> ﺪﻨﮐ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ.

JSONP ﯽﻓﺮﻌﻣ

JSONP ﻒﻔﺨﻣ JSON with Padding ﺖﺳﺍ.

.ﺪﻨﮐ ﺩﺎﺠﯾﺍ ﯽﺗﻼﮑﺸﻣ ﺪﻧﺍﻮﺗ ﯽﻣ ﯼﺍ ﻪﻨﻣﺍﺩ ﻦﯿﺑ ﯽﺸﻣ ﻂﺧ ﻞﯿﻟﺩ ﻪﺑ ﺮﮕﯾﺩ ﻪﻨﻣﺍﺩ ﮏﯾ ﺯﺍ ﻞﯾﺎﻓ ﺖﺳﺍﻮﺧﺭﺩ

.ﺩﺭﺍﺪﻧ ﺍﺭ ﻞﮑﺸﻣ ﻦﯾﺍ ﺮﮕﯾﺩ ﻪﻨﻣﺍﺩ ﺯﺍ ﯽﺟﺭﺎﺧ ﺖﭙﯾﺮﮑﺳﺍ ﺖﺳﺍﻮﺧﺭﺩ

JSONP ﺪﻨﮐ ﯽﻣ ﺖﺳﺍﻮﺧﺭﺩ ﺖﭙﯾﺮﮑﺳﺍ ﮓﺗ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﺑ ﺍﺭ ﺎﻫ ﻞﯾﺎﻓ ﻭ ﺪﻨﮐ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ ﺖﯾﺰﻣ ﻦﯾﺍ ﺯﺍ

 <script src="demo_jsonp.php">

ﺭﻭﺮﺳ ﻞﯾﺎﻓ

ﺪﻫﺩ ﯽﻣ ﺭﺍﺮﻗ a ﻞﺧﺍﺩ ﺭﺩ ﺍﺭ ﻪﺠﯿﺘﻧ ﺭﻭﺮﺳ ﯼﻭﺭ ﻞﯾﺎﻓ

ﻝﺎﺜﻣ

 <?php
$myJSON = '{ "name":"John", "age":30, "city":"New York" }';
  
echo "myFunc(".$myJSON.");";
  ?>

ﺪﻧﺍﺩﺮﮔ ﯽﻣﺮﺑ ﻥﺍﻮﻨﻋ ﻪﺑ JSON ﯼﺎﻫ ﻩﺩﺍﺩ ﺎﺑ "myFunc" ﻡﺎﻧ ﻪﺑ ﯽﻌﺑﺎﺗ ﻪﺑ ﺍﺭ ﯽﺳﺎﻤﺗ ﻪﺠﯿﺘﻧ

.ﺩﺭﺍﺩ ﺩﻮﺟﻭ ﯼﺮﺘﺸﻣ ﺭﺩ ﻊﺑﺎﺗ ﻪﮐ ﺪﯿﻨﮐ ﻞﺻﺎﺣ ﻥﺎﻨﯿﻤﻃﺍ

ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ ﻊﺑﺎﺗ

ﺖﺳﺍ ﺭﺎﮐ ﻩﺩﺎﻣﺁ ﻭ ﺩﺭﺍﺩ ﺭﺍﺮﻗ ﺖﻨﯾﻼﮐ ﯼﻭﺭ "myFunc" ﻡﺎﻧ ﺎﺑ ﯽﻌﺑﺎﺗ

ﻝﺎﺜﻣ

 function myFunc(myObj) 
  {
  document.getElementById("demo").innerHTML = 
  myObj.name;
  }

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<h2>Request JSON using the script tag</h2>
<p>The PHP file returns a call to a function that will handle the JSON data.</p>
<p id="demo"></p>

<script>
function myFunc(myObj) {
  document.getElementById("demo").innerHTML = myObj.name;
}
</script>

<script src="demo_jsonp.php"></script>

</body>
</html>

ﺎﯾﻮﭘ ﺖﭙﯾﺮﮑﺳﺍ ﮓﺗ ﺩﺎﺠﯾﺍ

ﺪﻨﮐ ﯽﻣ ﺍﺮﺟﺍ ﺪﺷﺎﺑ ﻪﺤﻔﺻ ﻪﮐ ﯽﻧﺎﻣﺯ ﺍﺭ "myFunc" ﻊﺑﺎﺗ ﻻﺎﺑ ﻝﺎﺜﻣ

:ﺩﻮﺷ ﺩﺎﺠﯾﺍ ﺪﯾﺎﺑ ﺯﺎﯿﻧ ﺕﺭﻮﺻ ﺭﺩ ﻂﻘﻓ ﺖﭙﯾﺮﮑﺳﺍ ﮓﺗ

ﻝﺎﺜﻣ

:ﺪﯿﻨﮐ ﺝﺭﺩ ﻭ ﺩﺎﺠﯾﺍ ﺍﺭ <script> ﮓﺗ ،ﻪﻤﮐﺩ ﯼﻭﺭ ﮏﯿﻠﮐ ﺎﺑ

 function clickButton() {
  let s = document.createElement("script");
  s.src = "demo_jsonp.php";
  document.body.appendChild(s);
  }

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>

<body>

<h2>Click the Button.</h2>
<p>A script tag with a src attribute is created and placed in the document.</p>
<p>The PHP file returns a call to a function with the JSON object as a parameter.</p>

<button onclick="clickButton()">Click me!</button>

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

<script>
function clickButton() {
  let s = document.createElement("script");
  s.src = "demo_jsonp.php";
  document.body.appendChild(s);
}

function myFunc(myObj) {
  document.getElementById("demo").innerHTML = myObj.name;
}
</script>

</body>
</html>

JSONP ﺎﯾﻮﭘ ﻪﺠﯿﺘﻧ

.ﺪﻨﺘﺴﻫ ﺖﺑﺎﺛ ﺭﺎﯿﺴﺑ ﺯﻮﻨﻫ ﻻﺎﺑ ﯼﺎﻫ ﻝﺎﺜﻣ

ﺱﺎﺳﺍ ﺮﺑ ﺍﺭ JSON ﯽﺷ ﮏﯾ php ﻞﯾﺎﻓ ﺪﯿﻫﺩ ﻩﺯﺎﺟﺍ ﻭ ﺪﯿﻨﮐ ﺎﯾﻮﭘ php ﻞﯾﺎﻓ ﻪﺑ JSON ﻝﺎﺳﺭﺍ ﺎﺑ ﺍﺭ ﻝﺎ

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 "myFunc(".json_encode($outp).")";
?>

:ﺩﺍﺩ ﺢﯿﺿﻮﺗ PHP ﻞﯾﺎﻓ

ﺪﯿﻨﮐ ﻞﯾﺪﺒﺗ ﯽﺷ ﮏﯾ ﻪﺑ ﺍﺭ ﺖﺳﺍﻮﺧﺭﺩ PHP ﻊﺑﺎﺗ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﺑ
.ﺪﯿﻨﮐ ﺮﭘ ﯽﺘﺳﺍﻮﺧﺭﺩ ﯼﺎﻫ ﻩﺩﺍﺩ ﺎﺑ ﺍﺭ ﻪﯾﺍﺭﺁ ﮏﯾ ﻭ ﺪﯿﻨﮐ ﺍﺪﯿﭘ ﯽﺳﺮﺘﺳﺩ ﻩﺩﺍﺩ ﻩﺎﮕﯾﺎﭘ ﻪﺑ
.ﺪﯿﻨﮐ ﻪﻓﺎﺿﺍ ﯽﺷ ﮏﯾ ﻪﺑ ﺍﺭ ﻪﯾﺍﺭﺁ
ﺪﯿﻨﮐ ﻞﯾﺪﺒﺗ JSON ﻪﺑ ﻪﯾﺍﺭﺁ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﺑ
"myFunc()" ﺪﯿﭽﯿﭙﺑ ﯽﺘﺸﮔﺮﺑ ءﯽﺷ ﻑﺍﺮﻃﺍ ﺭﺩ ﺍﺭ.

ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ ﻝﺎﺜﻣ

:ﺩﻮﺷ ﯽﻣ ﯽﻧﺍﻮﺧﺍﺮﻓ php ﻞﯾﺎﻓ ﺯﺍ "myFunc" ﻊﺑﺎﺗ

const obj = { table: "products", limit: 10 };
let s = document.createElement("script");
s.src = "jsonp_demo_db.php?x=" + JSON.stringify(obj);
document.body.appendChild(s);

function myFunc(myObj) {
  let txt = "";
  for (let x in myObj) 
  {
    txt += myObj[x].name + "<br>";
  
  }
  document.getElementById("demo").innerHTML = txt;
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<p>A script tag with a src attribute is created and placed in the document.</p>
<p>The PHP file returns a call to a function with an object as a parameter.</p>
<p id="demo"></p>

<p>Try changing the table property from "customers" to "products".</p>

<script>
const obj = { table: "customers", limit: 10 };
let s = document.createElement("script");
s.src = "jsonp_demo_db.php?x=" + JSON.stringify(obj);
document.body.appendChild(s);

function myFunc(myObj) {
  let txt = "";
  for (let x in myObj) {
    txt += myObj[x].name + "<br>";
  }
  document.getElementById("demo").innerHTML = txt;
}
</script>

</body>
</html>

ﺱﺎﻤﺗ ﻪﺑ ﺖﺸﮔﺮﺑ ﺩﺮﮑﻠﻤﻋ

ﺪﯿﻨﮐ ﯽﻣ ﺖﻓﺎﯾﺭﺩ ﺍﺭ ﺭﻭﺮﺳ ﻞﯾﺎﻓ ﻪﻧﻮﮕﭼ ،ﺪﯾﺭﺍﺪﻧ ﺭﻭﺮﺳ ﻞﯾﺎﻓ ﯼﻭﺭ ﯽﻟﺮﺘﻨﮐ ﭻﯿﻫ ﯽﺘﻗﻭ

ﺪﻫﺩ ﯽﻣ ﻪﺋﺍﺭﺍ ﻥﺍﻮﻨﻋ ﻪﺑ ﺍﺭ ﺱﺎﻤﺗ ﻪﺑ ﺦﺳﺎﭘ ﺩﺮﮑﻠﻤﻋ ﮏﯾ ﺭﻭﺮﺳ ﻞﯾﺎﻓ ﺕﺎﻗﻭﺍ ﯽﻫﺎﮔ

ﻝﺎﺜﻣ

:ﺪﻨﮐ ﯽﻣ ﯽﻧﺍﻮﺧﺍﺮﻓ ﺪﯿﻨﮐ ﯽﻣ ﻝﺎﺳﺭﺍ ﺱﺎﻤﺗ ﻪﺑ ﺦﺳﺎﭘ ﺮﺘﻣﺍﺭﺎﭘ ﻥﺍﻮﻨﻋ ﻪﺑ ﻪﮐ ﺍﺭ ﯽﻌﺑﺎﺗ php ﻞﯾﺎﻓ

let s = document.createElement("script");
s.src = "jsonp_demo_db.php?callback=myDisplayFunction";
document.body.appendChild(s);

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<h2>Request With a Callback Function</h2>
<p>The PHP file returns a call to the function you send as a callback.</p>
<p id="demo"></p>

<script>
let s = document.createElement("script");
s.src = "demo_jsonp2.php?callback=myDisplayFunction";
document.body.appendChild(s);

function myDisplayFunction(myObj) {
  document.getElementById("demo").innerHTML = myObj.name;
}
</script>

</body>
</html>