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。

我没有收到错误。我的问题是如何使用 XDomainRequest 提取数据,就像使用 getJSON 一样?

更新代码:

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

XDomainRequest 是使它工作的方法。如果您使用的是 jQuery 1.5 或更高版本,我建议您使用以下脚本。

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

该脚本透明地在 IE 8 和 9 中为 $.ajax 添加了对 CORS 的支持。只需将它放在 jQuery 脚本之后的某个位置并观察它的工作。

jQuery 不支持开箱即用的 XDomainRequest ( http://bugs.jquery.com/ticket/8283 ) 但从 jQuery 1.5 开始,您可以定义自定义传输来处理 IE 8 和 9 中的 CORS。

于 2014-02-05T23:35:41.143 回答
0

您可以使用 jQuery 插件jquery-transport-xdr在 IE8/9中启用CORS请求。

于 2015-10-06T20:26:50.073 回答