JavaScript で JSONP 互換のエンドポイントを作成する方法: 包括的なガイド

JavaScript での JSONP 互換エンドポイントの作成

クロスオリジン リソース共有 (CORS) の制限により、異なるドメインでホストされている Web サイト間の通信が妨げられる可能性があります。 JSONP (パディング付き JSON) は、ブラウザーのスクリプト タグの処理を活用することで回避策を提供します。

PHP で JSONP を実装する方法

JSONP 対応エンドポイントを作成するにはPHP の場合は、次の手順に従います:

1. GET リクエストでコールバック パラメーターを受け入れます (例: $callback = $_GET['callback'];)。
2. コールバック JavaScript 関数をラップします。ブラウザーの JSON 応答 (例: $callback.'('.$data.');'.
3. CORS に適切な HTTP ヘッダーを設定します。例:

<code class="php">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');</code>

このコードは、コールバック関数にパラメータとして渡された JSON オブジェクトを含む JavaScript ファイルを返します。

JSONP 互換エンドポイントの利用

を使用します。 JSONP サービスを利用するためのタグ:

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

スクリプトが実行されると、JSON 応答でレシーバー関数が呼び出され、クライアント側のデータにアクセスできるようになります。

以上がJavaScript で JSONP 互換のエンドポイントを作成する方法: 包括的なガイドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。