14

コードは非常に単純です。なぜそれが機能しないのかわかりません。

これは、JSONファイルhttp://webapp.armadealo.com/home.jsonへのリンクです。

getJSONを使用したコードは次のとおりです

$.getJSON("http://webapp.armadealo.com/home.json", function(data){
alert(data);
});

コードにJSONコンテンツ全体を表示させたいだけです。

4

4 に答える 4

6

何ヶ月にもわたる検索の結果、私は解決策を見つけました。したがって、私は自分の質問に答えています。

JSONがサポートされておらず、同一生成元ポリシーに固執している場合は、JSONをパディングでラップしてJSONPにする必要があります。

そのために、私たちは命を救うウェブサイトhttp://anyorigin.com/を持っています

URLを貼り付けて、対応するJQueryコードを次のように取得できます。 

$.getJSON('http://anyorigin.com/get?url=http%3A//webapp.armadealo.com/home.json&callback=?', function(data){
$('#output').html(data.contents);
});

独自のコードを使用する場合は、上記のコードのURLを使用してください。

http://anyorigin.com/get?url=http%3A//webapp.armadealo.com/home.json&callback=?

上記のURLは、JSONPと同じJSONデータを提供し、すべての問題を解決します。

私は次のコードを使用しました。これは成功するとdisplayAll関数を呼び出します

$.ajax({
        url: 'http://anyorigin.com/get?url=http%3A//webapp.armadealo.com/home.json&callback=?',
        type: 'GET',
        dataType: "json",
        success: displayAll
    });

function displayAll(data){
    alert(data);
}
于 2013-03-01T21:33:30.420 に答える
5

Chrome インスペクタを見ると、おそらく次のエラーが表示されます。

XMLHttpRequest はhttp://webapp.armadealo.com/home.jsonを読み込めません。オリジンhttp://stackoverflow.comは Access-Control-Allow-Origin で許可されていません。

これが意味することは、サーバーがクライアント Web ページにファイルを読み取らせたくないということです。クライアントは信頼されていません。これは、mybank.evil.com のようなサイトが mybank.com からデータをダウンロードするのを防ぐための XMLHttpRequest の基本的なセキュリティ機能です。残念ながら、ローカル ファイルからのテストは困難です。

データまたは選択した数のサイトを信頼するAccess-Control-Allow-Originサイトがある場合は、特定のサイトの通過を許可するようにサーバー スクリプトを構成できます。

詳細については、 https://developer.mozilla.org/en/http_access_controlを参照してください。

于 2012-07-12T17:08:19.753 に答える
1

それはうまくいくはずです。

  1. firebug または別のデバッグ コンソールでリクエストを確認しましたか?

  2. same-origin-policyを検討してください。したがって、このリクエストを行うスクリプトも webapp.armadealo.com からロードする必要があります。そうでない場合は、jsonp-request が必要です。見てください：http://api.jquery.com/jQuery.ajax/

于 2012-07-12T17:07:02.587 に答える
1

私が言えることは、あなたのサーバーはリクエストで JSONP をサポートしていないということです。例えば

var getUrl = 'http://webapp.armadealo.com/home.json';
                $.ajax({
                    url : getUrl,
                    type : 'GET',
                    dataType : 'jsonp text',
                    jsonp: 'jsonp',
                    crossDomain : true,
                    success: function() { console.log('Success!'); },
                    error: function() { console.log('Uh Oh!'); },
                });

これは言うでしょうSyntaxError: invalid label。あなたが持っている戻り値は、適切にフォーマットされた JSONP ではありません。jQuery で必要なため、JSONP として機能するにはラップする必要があります。

したがって、返されるものは正しいですが、必要なものではありません。JSONP 呼び出しに必要なものは次のようになります。

functionName({
  "mall": {
  "name": "South Shore Plaza",
  "city": "Braintree",
  "directory": "/assets/directory/0000/0094/show_floorplan.aspx",
  "postal_code": "02184",
  "street": "250 Granite St",
  "lng": -71.023692,
  "id": 147,
  "phone": "(781) 843-8200",
  "lat": 42.218688,
  "state": "MA"
}
});

... 現在返されているのは有効な JavaScript ではなく (それ自体であり、それがそれです)、それが JSONP のしくみであるため、応答は実際には実行可能な JavaScript である必要があります。

<script>そのコードをブロック内のページに直接挿入するだけで、同じエラーが発生する可能性があります。

データの一部を埋め込みたい場合は、jQuery-oembedなどのプラグインを使用することをお勧めします。データが必要な場合は、JSON を処理するためにサーバー上に何かが必要です。その後、サーバーからデータを取得します。

例えば

では、jQuery を使用してクロスドメインを作成したいとしましょう。jQuery$.ajax呼び出しは次のようになります。

$.ajax({
  dataType: 'jsonp',
  data: 'id=test',
  jsonp: 'jsonp_callback',
  url: 'http://www.differentdomain.com/get_data.php',
  success: function () {
    // do something
  },
});

サーバー側 ( get_data.phpファイル内) では、コールバック名を取得し、コールバック関数にラップされた JSON 形式でデータを送信する必要があります。このようなもの：

<?php
$jsonp_callback = $_GET['jsonp_callback'];
$data = array('1','2','3');
echo $jsonp_callback . '('.json_encode($data).');';
?>

JSONP は、サーバーが応答を JavaScript 関数呼び出しに適切に埋め込む場合にのみ使用できます。

于 2012-07-18T20:32:29.643 に答える