JSONP
JSONP, etki alanları arası sorunlar hakkında endişelenmeden JSON verilerini göndermeye yönelik bir yöntemdir.
JSONP XMLHttpRequestnesneyi kullanmaz.
JSONP <script>bunun yerine etiketi kullanır.
JSONP'ye Giriş
JSONP, Dolgulu JSON anlamına gelir.
Başka bir etki alanından dosya istemek, etki alanları arası politika nedeniyle sorunlara neden olabilir.
Başka bir etki alanından harici bir komut dosyası istemek , bu sorunu yaşamaz.
JSONP bu avantajı kullanır ve XMLHttpRequestnesne yerine komut dosyası etiketini kullanarak dosya ister.
<script src="demo_jsonp.php">
Sunucu Dosyası
Sunucudaki dosya, sonucu bir işlev çağrısının içine sarar:
Örnek
<?php
$myJSON = '{ "name":"John", "age":30, "city":"New York" }';
echo "myFunc(".$myJSON.");";
?>
Sonuç, parametre olarak JSON verileriyle "myFunc" adlı bir işleve yapılan bir çağrıyı döndürür.
İşlevin istemcide var olduğundan emin olun.
JavaScript işlevi
"myFunc" adlı işlev istemcide bulunur ve JSON verilerini işlemeye hazırdır:
Örnek
function myFunc(myObj)
{
document.getElementById("demo").innerHTML =
myObj.name;
}
Dinamik Komut Dosyası Etiketi Oluşturma
Yukarıdaki örnek, script etiketini nereye koyduğunuza bağlı olarak sayfa yüklenirken "myFunc" işlevini yürütecektir, bu pek tatmin edici değildir.
Komut dosyası etiketi yalnızca gerektiğinde oluşturulmalıdır:
Örnek
Bir düğme tıklandığında <script> etiketini oluşturun ve ekleyin:
function clickButton() {
let s = document.createElement("script");
s.src = "demo_jsonp.php";
document.body.appendChild(s);
}
Dinamik JSONP Sonucu
Yukarıdaki örnekler hala çok statiktir.
JSON'u php dosyasına göndererek örneği dinamik hale getirin ve php dosyasının aldığı bilgilere göre bir JSON nesnesi döndürmesine izin verin.
PHP dosyası
<?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 Dosyası açıkladı:
- PHP json_decode() işlevini kullanarak isteği bir nesneye dönüştürün .
- Veritabanına erişin ve bir diziyi istenen verilerle doldurun.
- Diziyi bir nesneye ekleyin.
- json_encode() işlevini kullanarak diziyi JSON'a dönüştürün .
- "myFunc()" öğesini dönüş nesnesinin etrafına sarın.
JavaScript Örneği
"myFunc" işlevi php dosyasından çağrılır:
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;
}
Geri Arama İşlevi
Sunucu dosyası üzerinde hiçbir kontrolünüz olmadığında, sunucu dosyasının doğru işlevi çağırmasını nasıl sağlarsınız?
Bazen sunucu dosyası parametre olarak bir geri arama işlevi sunar:
Örnek
PHP dosyası, geri arama parametresi olarak ilettiğiniz işlevi arayacaktır:
let s = document.createElement("script");
s.src = "jsonp_demo_db.php?callback=myDisplayFunction";
document.body.appendChild(s);