ホームページ  >  記事  >  ウェブフロントエンド  >  jsonp はどのようにしてドメイン間でデータを取得するのでしょうか? (コード例)

jsonp はどのようにしてドメイン間でデータを取得するのでしょうか? (コード例)

青灯夜游
青灯夜游転載
2019-01-05 10:24:143305ブラウズ

jsonp はどのようにしてドメイン間でデータを取得するのでしょうか?この記事では、jsonp を使用してクロスドメイン データを取得する方法を紹介します。必要な方は参考にしていただければ幸いです。

Jsonp クロスドメインデータ取得の説明

ブラウザには同一オリジンポリシーがあるため、オリジナル以外のオリジンを取得したい場合(プロトコル、ドメイン名、3 つのポートが異なる場合、それらはオリジナルではないとみなされます) ページのデータはクロスドメインである必要があります

#(1) jsonp 原則

script タグの src 属性はオリジナル以外の js スクリプトにアクセスできるため、src 属性を通じてサーバーにアクセスすると関数の js コードが返され、必要なデータが関数として返されます。パラメータを指定し、最初にこの関数を定義して戻ります。 js コードを実行できます。

(2) jsonp 実装コード

リクエスト ページ

76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
    b2386ffb911b14667cb8f0f91ea547a76e916e0f7d1e588d4f442bf645aedb2f
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
8019067d09615e43c7904885b5246f0a
    function jsonp(data){
        console.log(username)
    }
2cacc6d41bbb37262a98f745aa00fbf0
32c428c1a65afb4c21320ec475b9ffe4
2cacc6d41bbb37262a98f745aa00fbf0
8019067d09615e43c7904885b5246f0a
    $(document).ready(function(){
        var url = "http://www.example.com/jsonp.php?callback=jsonp";
        var script = $('3f1c4e4b6b16bbbd69b2ee476dc4f83a053a9cc4c2e9b9f6f911642332d34e85');
        script.attr("src",url);
        $("body").append(script);
    });
2cacc6d41bbb37262a98f745aa00fbf0
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
7bf6f68ac33b2a6d14a606479bed8015
その後、php は戻ります

jsonp({
    name:'niuni
})
その後、PHP から返されたコード h は、要求されたページの jsonp メソッドによって実行されます

( 3) jQuery の単純な jsonp クロスドメイン

<script>
    function showData (data) {
        console.info(data);
    }
    $(document).ready(function () {
        $("#btn").click(function () {
            $.ajax({
                url: "http://www.example.comjsonp",
                type: "GET",
                dataType: "jsonp",// 返回数据类型
                jsonpCallback: "showData",//回调函数
                // 获取数据成功就执行success函数
                success: function (data) {
                    console.info("data");
                }
            });
        });
    });
</script>

要約: 以上がこの記事の全内容です。皆さんの学習に役立つことを願っています。さらにエキサイティングなコンテンツについては、PHP 中国語 Web サイトの関連チュートリアルのコラムに注目してください。 ! !

以上がjsonp はどのようにしてドメイン間でデータを取得するのでしょうか? (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcnblogs.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。