2

JSON ファイルにアクセスし、オブジェクトを抽出し、jquery を使用して html を追加するコードをいくつか作成しました。これは CORS を使用して行われます。これは、IE 8 と 9 以外のすべてで完璧に機能します。

XDomainRequest がこれを機能させるための方法であると読みましたが、方法がわかりません。どんな助けでも大歓迎です。

html1 や click1 などについて心配する必要はありません。完全なファイルではすべてが正常に機能します。XDomainRequest のサポートが必要です。

if(window.XDomainRequest){
    var xdr = new XDomainRequest(); 

    xdr.open("get", "[link_to_JSON_on_different_server]");

    xdr.send();
} else {
    $.getJSON("[link_to_JSON_on_different_server]",function(data){
        if (click2){
            var href2 = click2 + encodeURIComponent(data.fuse[0].link);

        }else{
            var href2 = data.fuse[0].link;
        }

        if (click3){
            var href3 = click3 + encodeURIComponent(data.fuse[1].link);
        }else{
            var href3 = data.fuse[1].link;
        }
        $('#title').append('<a href="'+href2+'">'+data.fuse[0].title+'</a>');
        $('#favicon').append('<img style="padding-right:10px;max-width: 16px;" src="http://'+data.fuse[0].domain+'/favicon.ico"> '+data.fuse[0].domain+' ');
        $('#content').append(data.fuse[0].content);

        $('#read').append('<a href="'+href2+'">Read More ></a>');

        $('#title1').append('<a href="'+href3+'">'+data.fuse[1].title+'</a>');
        $('#favicon1').append('<img style="padding-right:10px;max-width: 16px;" src="http://'+data.fuse[1].domain+'/favicon.ico"> '+data.fuse[1].domain+' ');
        $('#content1').append(data.fuse[1].content);
        $('#read1').append('<a href="'+href3+'">Read More ></a>');
    });
}

編集:

JSONP を使用できません。

エラーは発生しません。私の問題は、getJSON の場合と同様に、XDomainRequest を使用してデータを抽出する方法です。

更新されたコード:

if(window.XDomainRequest){// 1. Create XDR object: 
var xdr = new XDomainRequest(); 

xdr.onload = function() {
    var responseText = xdr.responseText;
    // TODO handle success response here.
obj = JSON.parse(xdr.responseText);
$('#title').append('<a href="'+href2+'">'+obj.fuse[0].title+'</a>');
alert('success');
};

xdr.onerror = function() {
    // The request has failed.  No specific information will be provided by XDR unfortunately. 
    alert('fail');
};

xdr.open("get", "[link_to_JSON_on_different_server]");
xdr.send();
} else {
            $.getJSON("[link_to_JSON_on_different_server]",function(data){
if (click2){
 var href2 = click2 + encodeURIComponent(data.fuse[0].link);

}else{
var href2 = data.fuse[0].link;
}

if (click3){
 var href3 = click3 + encodeURIComponent(data.fuse[1].link);
}else{
var href3 = data.fuse[1].link;
}
             $('#title').append('<a href="'+href2+'">'+data.fuse[0].title+'</a>');
             $('#favicon').append('<img style="padding-right:10px;max-width: 16px;" src="http://'+data.fuse[0].domain+'/favicon.ico"> '+data.fuse[0].domain+' ');
             $('#content').append(data.fuse[0].content);
             $('#read').append('<a href="'+href2+'">Read More ></a>');

             $('#title1').append('<a href="'+href3+'">'+data.fuse[1].title+'</a>');
             $('#favicon1').append('<img style="padding-right:10px;max-width: 16px;" src="http://'+data.fuse[1].domain+'/favicon.ico"> '+data.fuse[1].domain+' ');
             $('#content1').append(data.fuse[1].content);
             $('#read1').append('<a href="'+href3+'">Read More ></a>');
         });
         }
4

3 に答える 3

1

コードにエラーが見られないため、XDomainRequest を使用するときにサーバーの応答を処理する方法がわからない場合があります。コメントで述べたように、XDomainRequest の API は、XMLHttpRequest によって提供される API のサブセットです。したがって、応答を取得するには、コードは次のようになります。

var xdr = new XDomainRequest(); 

xdr.onload = function() {
    var responseText = xdr.responseText;
    // TODO handle success response here.
};

xdr.onerror = function() {
    // The request has failed.  No specific information will be provided by XDR unfortunately.  
};

xdr.open("get", "[link_to_JSON_on_different_server]");
xdr.send();
于 2014-02-05T16:19:25.567 に答える
0

jQuery プラグインjquery-transport-xdrを使用して、IE8/9 でCORSリクエストを有効にすることができます。

于 2015-10-06T20:26:50.073 に答える
0

XDomainRequest はそれを機能させる方法です。jQuery 1.5 以降を使用している場合は、次のスクリプトを使用することをお勧めします。

https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest

このスクリプトは、CORS のサポートを IE 8 および 9 の $.ajax に透過的に追加します。jQuery スクリプトの後のどこかにドロップして、動作を確認してください。

jQuery はそのままでは XDomainRequest をサポートしていませんが ( http://bugs.jquery.com/ticket/8283 )、jQuery 1.5 以降では、IE 8 および 9 で CORS を処理するカスタム トランスポートを定義できます。

于 2014-02-05T23:35:41.143 に答える