ホームページ  >  記事  >  バックエンド開発  >  クロスドメイン JavaScript の JSONP コールバックを実装するにはどうすればよいですか?

クロスドメイン JavaScript の JSONP コールバックを実装するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-10-22 15:41:02404ブラウズ

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>

JavaScript の使用法

JSONP サービスを利用するには、次のスクリプト タグを使用できます。

<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 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。