web-dev-qa-db-ja.com

IE9 jQuery AJAX CORSで「アクセスが拒否されました」を返します

以下はすべてのブラウザで動作しますIEを除く(IE 9でテストしています)。

jQuery.support.cors = true;
...
        $.ajax(
            url + "messages/postMessageReadByPersonEmail",
            {
                crossDomain: true,
                data: {
                    messageId       : messageId,
                    personEmail     : personEmail
                },
                success: function() {
                    alert('marked as read');
                },
                error: function(a,b,c) {
                    alert('failed');
                },
                type: 'post'
            }
        );

dataType: 'jsonp'を使用する別の関数がありますが、このAJAX呼び出しでデータを返す必要はありません。私の最後の手段は、それを機能させるためだけにJSONPでラップされたジブラッシュを返すことです。

IEがデータを返さないCORSリクエストで失敗する理由はありますか?

123
Garrett

これは、jQueryでの既知の bug です。 jQueryチームには「コアでこれをサポートする予定はなく、プラグインとしてより適しています」。 ( このコメント を参照)。 IEはXMLHttpRequestnot使用しますが、XDomainRequestという名前の代替オブジェクトを使用します。

isjQueryでこれをサポートするために利用可能なプラグインがあります。 はここで見つけることができますhttps://github.com /jaubourg/ajaxHooks/blob/master/src/xdr.js

EDIT関数$.ajaxTransportはトランスポーターファクトリを登録します。トランスポーターは、要求を実行するために$.ajaxによってinternallyによって使用されます。したがって、assumeを使用すると、通常どおり$.ajaxを呼び出すことができます。トランスポーターと拡張$.ajaxに関する情報は、 here にあります。

また、このプラグインのおそらくより良いバージョンは here にあります。

他の2つのメモ:

  1. オブジェクトXDomainRequestは IE8 から導入されたもので、以下のバージョンでは機能しません。
  2. IE10から、CORSは 通常のXMLHttpRequest を使用してサポートされます。

編集2:httpからhttpsへの問題

リクエストは、ホスティングページと同じスキームをターゲットにする必要があります

この制限は、AJAXページが http://example.com にある場合、ターゲットURLもHTTPで始まる必要があることを意味します。同様に、AJAXページが https://example.com にある場合、ターゲットURLもHTTPSで始まる必要があります。

ソース: http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx

149
dennisg

@dennisgが受け入れた回答を基に、MoonScriptで jQuery.XDomainRequest.js を使用してこれを成功裏に達成しました。

次のコードは、Chrome、Firefox、IE10では正常に機能しましたが、IE9では失敗しました。スクリプトを含めるだけで、IE9で自動的に機能するようになりました。 (そしておそらく8ですが、私はそれをテストしていません。)

var displayTweets = function () {
    $.ajax({
        cache: false,
        type: 'GET',
        crossDomain: true,
        url: Site.config().apiRoot + '/Api/GetTwitterFeed',
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (data) {
            for (var Tweet in data) {
                displayTweet(data[Tweet]);
            }
        }
    });
};
62
JackMorrissey

「jQuery-ajaxTransport-XDomainRequest」プラグインを使用してこれを行う方法の詳細な手順については、こちらをご覧ください。 https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest#instructions

このプラグインは積極的にサポートされており、HTML、JSON、およびXMLを処理します。このファイルはCDNJSでもホストされているため、追加のセットアップなしでスクリプトをページに直接ドロップできます。 http://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.1 /jquery.xdomainrequest.min.js

16
MoonScript

問題は、IE9以下ではCORSがサポートされていないことです。 XDomainRequestは、ここで説明するGET/POSTおよびtext/plain conten-typeのみをサポートします: http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and -workarounds.aspx

したがって、すべてのHTTP動詞やjsonなどを使用する場合は、別のソリューションを使用する必要があります。 IE9以下が使用されている場合、プロキシに正常にダウングレードするプロキシを作成しました。 ASP.NETを使用している場合、コードをまったく変更する必要はありません。

ソリューションは2つの部分に分かれています。 1つ目は、jQuery ajax処理にフックするjqueryスクリプトです。 crossDomainリクエストが行われ、ブラウザがIEの場合、自動的にWebサーバーを呼び出します。

$.ajaxPrefilter(function (options, originalOptions, jqXhr) {
    if (!window.CorsProxyUrl) {
        window.CorsProxyUrl = '/corsproxy/';
    }
    // only proxy those requests
    // that are marked as crossDomain requests.
    if (!options.crossDomain) {
        return;
    }

    if (getIeVersion() && getIeVersion() < 10) {
        var url = options.url;
        options.beforeSend = function (request) {
            request.setRequestHeader("X-CorsProxy-Url", url);
        };
        options.url = window.CorsProxyUrl;
        options.crossDomain = false;
    }
});

Webサーバーでは、リクエストを受信し、X-CorsProxy-Url httpヘッダーから値を取得し、HTTPリクエストを実行して、最終的に結果を返す必要があります。

私のブログ投稿: http://blog.gauffin.org/2014/04/how-to-use-cors-requests-in-internet-Explorer-9-and-below/

3
jgauffin

Internet Explorer 8以降のバージョンでjQueryを使用してクロスドメインJSONを取得する

非常に便利なリンク:

http://graphicmaniacs.com/note/getting-a-cross-domain-json-with-jquery-in-internet-Explorer-8-and-later/

Xドメインリクエストからjsonを返す問題を解決できます。

これが誰かを助けることを願っています。

1
jmarcosSF

MoonScriptによるソリューションに基づいて、代わりにこれを試すことができます。

https://github.com/intuit/xhr-xdr-adapter/blob/master/src/xhr-xdr-adapter.js

利点は、低レベルのソリューションであるため、jQueryだけでなく、他のフレームワークでIE 8/9で(可能な限り)CORSを有効にすることです。 AngularJSとjQuery 1.xおよび2.xを使用して成功しました。

1
yanni

すべてのリクエストを行いましたJSONPこれは、サポートされているすべてのブラウザー(IE7 +およびレギュラー)に対する唯一のソリューションであったためです。あなたの答えはIE9で技術的に機能するので、あなたは正しい答えを持っています。

1
Garrett

この問題を解決するには、次のような.jsがajaxファイルに含まれているかどうかも確認します。

0
hacklover

2015年初頭の更新。xDomainは、IE9でCORSをサポートするために広く使用されているライブラリであり、追加のコーディングが制限されています。

https://github.com/jpillora/xdomain

0
Alkaline

開発マシンでCORS Webサービスをテストしていましたが、IEのみで「アクセスが拒否されました」というエラーメッセージが表示されていました。 FirefoxおよびChromeは正常に機能しました。これは、ajax呼び出しでlocalhostを使用したことが原因であることがわかりました!だから私のブラウザのURLは次のようなものでした:

http://my_computer.my_domain.local/CORS_Service/test.html

test.html内の私のajax呼び出しは次のようなものでした:

//fails in IE 
$.ajax({
  url: "http://localhost/CORS_Service/api/Controller",
  ...
});

Localhostの代わりにコンピューターIPを使用するようにajax呼び出しを変更すると、すべてが機能しました。

//Works in IE
$.ajax({
  url: "http://192.168.0.1/CORS_Service/api/Controller",
  ...
});

IE devツールウィンドウの[ネットワーク]タブには、CORS Preflight OPTIONSリクエストとそれに続くXMLHttpRequest GETも表示されます。

0
jwill212

IE8/9のCORS要求に jquery-transport-xdr jQueryプラグインを使用してみてください。

0
Gordon Freeman