Question

我被要求从xml Feed中获取一些“数据”并将其添加到我在我的服务器上托管的页面。我想我会使用jQuery Ajax api - 而且我收到了这个错误。

XMLHttpRequest cannot load .../3.atom. Origin http://myserver.com is not allowed by Access-Control-Allow-Origin.

我是否需要请求某人访问？有什么东西可以添加到我的请求中吗？我读过关于CORS的东西，这是我应该在这种情况下使用的服务吗？

这是我目前的代码。

var feedUrl = "http://www.holmanreviews.com/audi-pembroke-pines/3.atom";
var content;

$.ajax({
    type: "GET",
    url: feedUrl,
    dataType: "xml",
    crossDomain: true,
    success: function (xml) {
        $(xml).find('entry').each(function () {
            var $this = $(this);
            var id = $this.attr('id');
            content += id;
        });
    }
});

$('#feed').append(content);

我也有JS FIddle。 http://jsfiddle.net/rsturim/6nsyX/

如果你能提供帮助，我会喜欢这方面的背景 - 非常感谢。

Answer 1

您可能需要设置server-side proxy才能访问此数据。

CORS不起作用，因为您无法控制服务器。

JSON-P无法正常工作，因为服务器似乎不接受“回调”参数。我通过将“？callback = foo”附加到您的请求网址来测试这个，这不会改变响应。它们的API可能支持callback参数的其他名称，但是很难知道它们的API没有任何文档。

Answer 2

您正在提出请求，但远程站点需要支持CORS，而您收到的错误意味着它不支持它。

由于它是Atom提要，远程站点可能没有多少机会支持JSONP，所以最好的方法是使用代理。而不是自己滚动，你可以使用雅虎的YQL来获取XML或JSON。 YQL确实支持CORS，因此您可以获得。

XML：

http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D%22http%3A%2F%2Fwww.holmanreviews.com%2Faudi-pembroke-pines%2F3.atom%22%20and%20itemPath%3D%22feed.entry%22&format=xml

JSON：

http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D%22http%3A%2F%2Fwww.holmanreviews.com%2Faudi-pembroke-pines%2F3.atom%22%20and%20itemPath%3D%22feed.entry%22&format=json

XML将直接为您提供从网站上获得的内容，但使用JavaScript解析XML并不是很有趣，因此我强烈建议您使用JSON。（您也可以获得JSONP，但是使用CORS支持的JSON更好。）

从您的代码中我很确定您能够从基本网址构建这些网址，因此我将其留作练习（ - ;

哦，如果你真的需要支持早于10的Internet Explorer版本，或任何其他不支持CORS的浏览器，这里有一种在浏览器支持时使用CORS的简洁方法，否则使用JSONP：

dataType: $.support.cors ? "json" : "jsonp"

Answer 3

你必须使用JSONP。打破相同的原始政策是一个很好的技巧。这非常危险，因此您必须信任数据的提供者。

在请求配置中使用相关的dataType：

dataType: "xml"

此外，您的Feed需要支持JSONP。这意味着，如果请求URL的后缀是callback =？之类的查询，则响应必须包含在Javascript函数中，并且需要引用引号：

callback("<your-xml>...</your-xml>");

这是JSONP的基本思想。如果您想了解为什么必须这样做，请查看维基百科文章以供考试：JSONP

如何使用Ajax创建跨域请求？

3 个答案: