首頁  >  文章  >  後端開發  >  如何實作跨域JavaScript的JSONP回呼?

如何實作跨域JavaScript的JSONP回呼?

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-10-22 15:41:02401瀏覽

How to Implement JSONP Callback for Cross-Domain JavaScript?

跨域JavaScript的JSONP回調實作

為了方便不同域之間的通信,引入了JSONP(JSON with Padding)。此技術涉及建立一個回調函數,該函數可用於包裝 JSON 資料並使其可以從不同的網域進行存取。以下是如何在PHP 中實作JSONP:

接受回呼參數

首先,在GET 請求中,我們接受一個名為「callback」的參數:

<code class="php">if(array_key_exists('callback', $_GET)){
    ...
}</code>

包裝回呼函數

接下來,我們將回呼JavaScript 函數包裝在我們的資料周圍。例如:

<code class="php">$callback = $_GET['callback'];
echo $callback.'('.$data.');';</code>

PHP 範例

這是一個PHP 範例:

<code class="php"><?php

$data = '{}'; // json string

if(array_key_exists('callback', $_GET)){

    header('Content-Type: text/javascript; charset=utf8');
    header('Access-Control-Allow-Origin: http://www.example.com/');
    header('Access-Control-Max-Age: 3628800');
    header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE');

    $callback = $_GET['callback'];
    echo $callback.'('.$data.');';

}else{
    // normal JSON string
    header('Content-Type: application/json; charset=utf8');

    echo $data;
}
?></code>

Script Java s對應>要使用JSONP 服務,您可以使用script 標籤:

<code class="html"><script>
    function receiver(data){
        console.log(data);
    }
</script>
<script src="data-service.php?callback=receiver"></script></code>
概念解釋

JSONP 背後的核心思想是返回一個調用回調函數並調用回調函數並調用回調函數並調用提供JSON 物件作為第一個參數的JavaScript 檔案。 PHP 中的 json_encode() 函數可用來將陣列和物件轉換為 JSON 字串。

利用 JSONP 可以在不同域的腳本之間建立通信,有效繞過同源策略限制,實現資料的傳輸跨域交換。

以上是如何實作跨域JavaScript的JSONP回呼?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn