0

サーバーに既に .json オブジェクトがあります。これは正しく、構文エラーはありません (有効な json)。アプリとは別のサーバーに存在するため、JSONP を介してこのオブジェクトを呼び出したいと考えています。

クライアント側でそれを達成する方法は理解していると思いますが、サーバー部分に関して何をすべきかわかりません。すでにウェブ上にある情報に従っていると、常にエラーが発生します。何か助けはありますか？

4

2 に答える 2

6

JSONP は JSON とは何の関係もありません。簡単な (しかし役に立たない) 例を次に示します。

  • クライアントはスクリプト要素を作成します: <script src="http://example.com/foo.js>. これにより、ブラウザは からフェッチfoo.jsしexample.comます。

  • サーバーは のリクエストを受信しますfoo.js。サーバーは のコンテンツをfoo.jsクライアントに提供します (単に であるとしますalert(1))。

  • クライアントは のコンテンツを取得し、foo.jsそれらのコンテンツをスクリプトとして実行します。(つまり、クライアントはそうしますalert(1)。)

これはどのように役立ちますか？foo.js へのリクエストで引数を渡すことができます。

  • クライアントは<script src="http://example.com/foo.js?arg=123>

  • サーバーは のリクエストを受信しますfoo.js?arg=123。サーバーはその値を使用して何かを行います。argたとえば、2 を掛けるとします (ただし、 uid を使用してユーザーのユーザー名を検索するなど、何か便利なことを行うことができます123)。次に、サーバーはスクリプト コンテンツを返信しますalert(246)。

  • **クライアントはサーバーからスクリプトを実行し、アラートを出し246ます。

クライアントに詰め込みたい場合はこれで十分ですが、どうすればalert便利なことができるのでしょうか? クライアント関数の名前を引数として指定します。

  • クライアントは関数myFuncを次のように定義します。function myFunc(a) { alert(a) }

  • クライアントは<script src="http://example.com/foo.js?callback=myFunc&arg=123>

  • サーバーは のリクエストを受信しfoo.js?callback=myFunc&arg=123、そのサーバー側のスクリプトcallbackは、 で呼び出される関数の名前として引数を使用する必要があることを認識しfoo.jsます。サーバーはスクリプトの内容を返しますmyFunc(246)。

  • クライアントが実行されmyFunc(246)ます。ここでは、myFuncその引数を単にアラートするように指定しましたが、好きなことをさせることができます。

それがJSONPの仕組みです。クライアントは、クライアント側関数の名前を含むスクリプト URL でサーバーに引数を提供し、サーバーはクライアントが実行するスクリプト( JSON ではありません!) を返します。もちろん、結果のスクリプトには のように JSON を含めることができますmyFunc({ 'foo' : 5 })が、最終的には、その JSON はスクリプト コンテンツの一部にすぎません。

于 2013-10-18T19:30:05.437 に答える
6

JSONP は基本的に、サイトがデータをロードして同一生成元ポリシーを無視できるようにするための「ハック」です。<script>ページにタグを追加することで機能します。

事実上の方法は、リクエストでコールバックを送信することです。次に、サーバーはその名前を取得し、データでその関数を呼び出す JS ファイルを生成します。

?callback=?jQuery を使用すると、実行時に URL に追加するだけで JSONP 呼び出しを行うことができます$.getJSON。

例：

$.getJSON('http://YourSite.com/path/to/json.php?callback=?', function(data){
    console.log(data); // this will be parsed for you
});

または、完全な$.ajax方法を使用できます。

$.ajax({
    url: 'http://YourSite.com/path/to/json.php',
    dataType: 'jsonp', // this tells jQuery to add "callback=?" for you
    success: function(data){
        console.log(data); // this will be parsed for you
    }
});

AJAX 呼び出しを行う代わりに、jQuery は実際に以下を追加します。

<script src="http://YourSite.com/path/to/json.php?callback=jQuery12345"></script>

あなたのページに（注：jQuery12345ランダムに生成されます）。

次に、サーバーで、有効な JavaScript ファイルで応答する必要があります。callbackクエリ文字列で渡された関数への呼び出しが含まれている必要があります。このようなもの：

jQuery12345({your: ['json', 'data']});

PHP での例 (使用するサーバー側言語に適応) は次のようになります。

$array = ['a' => 1, 'b' => 2,'c' => 3];
$callback = $_GET['callback'];

header('Content-type: text/javascript');
echo "{$callback}(".json_encode($array).");";

それだけです。詳細については、JSONP に関するウィキペディアのページを参照してください: http://en.wikipedia.org/wiki/JSONP

于 2013-10-18T19:25:45.090 に答える