web-dev-qa-db-ja.com

オリジン 'url'はAccess-Control-Allow-Originでは許可されていません

次のjquery（ダミー）コードを使用して、Google Currency Calculatorで通貨レートを取得しようとしています。

    $.getJSON("http://www.google.com/ig/calculator?hl=en&q=1" + "DOP" + "=?" + "USD",
        function(data) {
            $('.currNumber').each(function (index) {
                $(this).html(parseFloat($(this).html()) * 0.02681);
                                  });
          });

XMLHttpRequestを読み込めません http://www.google.com/ig/calculator?hl=ja&q=1DOP=?USD 。 Origin 'hostURL'はAccess-Control-Allow-Originでは許可されていません。

サイトを見て、私は主題についてさまざまなトピックを見つけましたが、それらは主にローカルファイルアクセスを参照し、追加のパラメーターを使用してchromeを開始することで解決しようとします（私もchromeを使用しています）しかし、それは私の問題ではなく、実際にはクロスドメイン制限に関連しているようです。

だから、質問です：jQueryを使用してそのURLからレートを取得するにはどうすればよいですか？

jqueryjsoncross-domain
13
PedroC88

Ajaxリクエストは、ブラウザの Same Origin Policy によって制限されます。つまり、スクリプトが実行されているページと同じドメインにないajaxを介してサーバーに直接通信することはできません。つまり、google.comのページを開発しているのでなければ、 google.comと直接通信することはできません。

この制限の回避策として、スクリプトタグの挿入（スクリプトタグを介して読み込まれたJSファイルは同じOriginポリシーの対象ではない）を含み、次にJSONPコールバックを使用して、データの結果をそれらのスクリプトタグからメインスクリプトに通信します。使用しようとしているAPIがサポートしている場合は、おそらくここでこれを行う必要があります。

jQueryは、ajax呼び出しを自動的にJSONP呼び出しに変換できるので、スクリプトタグを介して読み込まれ、クロスドメインの状況で機能するため、jQueryは非常に役立ちます。 そのajax関数のjQuery doc によると、ajax呼び出しのパラメーター文字列に「callback =」と表示された場合、またはcrossDomainオプションを設定した場合、これは自動的に行われます。

17
jfriend00

このリンクからのようです- http://api.jquery.com/jQuery.ajax/ -これは以前jfriend00によって提供されました-「crossDomain」と呼ばれるJQuery ajaxリクエストに含めることができるパラメーターについて説明していますこれはブール値です。

crossDomain（デフォルト：同一ドメイン要求の場合はfalse、クロスドメイン要求の場合はtrue）タイプ：ブール同じドメインでcrossDomain要求（JSONPなど）を強制したい場合は、crossDomainの値をtrueに設定します。これにより、たとえば、サーバー側の別のドメインへのリダイレクトが可能になります。 （追加されたバージョン：1.5）

したがって、これをtrueに設定すると、これを解決（？）する必要があります。私は専門家ではありませんが、この問題に継続的に遭遇した後で試しましたが、問題は解決したようです。

例：

$.ajax({ //my ajax request
        url: "_URL_I_AM_MAKING_REQUEST_TO_",
        type: "GET",
        cache: false,
        dataType: "json",
        **crossDomain: true,**
        data: { _mydata_
        success : function(response){}
});
2
Adam

編集
問題が何であるかは明らかであると思いましたが、ここではそうではないようです。このエラーは、サーバーがajaxリクエストを介してドメインのリソースにアクセスすることを制限していることを示しています。これは 標準のJavaScriptセキュリティ です-スクリプトは、元のドメインとのみ通信できます。 JavaScriptはGoogleのドメインから読み込まれなかったため、ajaxを介して電卓APIにアクセスできるドメインのリストに含まれていないため、このエラーメッセージが表示されます。

JQueryでクロスドメインリクエストを行うためのオプションは ここで概説 です。前述のように、JSONPは、適切にフォーマットされたJSONを送り返す必要があるため、サーバーがサポートしている場合にのみ有効なオプションになります。

参照しているページへのリンクを提供すると役立つ場合があります。

ただし、見た目から見ると、このAPIは [〜＃〜] jsonp [〜＃〜] をサポートしていません（文書化されていないパラメーターがない限り）これは、クロスドメインのほとんどの唯一のオプションですこの場合のajax要求は、サーバーを制御しておらず、 アクセス制御ヘッダー を変更できないためです。

the PHP script here などのJavaScriptセキュリティモデルに制約されずに、このAPIにアクセスするサーバー側リソースを構築することを検討してください。

2
no.good.at.coding

情報のマイナー追加ポイント。

自分のサーバーに投稿しようとしたときにこのエラーが発生したため、この質問に行きました。

解決策：ajax呼び出しでホスト名が一致することを確認します。

例：

//This failed

$.post("http://domain.com/index.php/count/",

//This succeeded (the page this was called from was www.domain.com/.....)

$.post("http://www.domain.com/index.php/count/",
1
ssaltman