XMLHttpRequest - flickr - 交叉来源 header

XMLHttpRequest - flickr - cross origin header

只是玩了一下 Flickr API,似乎无法成功地从中抓取任何东西。

我尝试使用下面的 Jquery 代码

var flickrURL = "https://api.flickr.com/services/feeds/photos_public.gne?format=jsoncallback=?";
var flickrOptions = {
    tags: "cats",
    format: "json"
}
var ajaxCallback = function(data){
    console.log(data);
};
$.getJSON(flickrURL, flickrOptions, ajaxCallback);

我也试过老香草路线

var xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.flickr.com/services/feeds/photos_public.gne?format=jsoncallback=?");
xhr.onreadystatechange = function(data){
    console.log(data);
}
xhr.send();

我使用 AJAX/XMLrequest 成功但没有使用 API。当香草失败时,我得到“No 'Access-Control-Allow-Origin' header”,我不明白,因为它是一个开放的提要,并且 Jquery 我得到 'jsonFlickrFeed is not defined'。这两个我都觉得很费解

您只需要做一些小改动

var flickrURL = 

"https://api.flickr.com/services/feeds/photos_public.gne?format=jsoncallback=?";

var flickrOptions = {
    tags: "cats",
    format: "json"
}

var jsonFlickrFeed = function(data){
    console.log(data);
};

$.getJSON(flickrURL, flickrOptions);

Flickr 响应查找 jsonFlickrFeed 函数,该函数在您的案例中未定义。

https://codepen.io/smtgohil/pen/ZXeYqB?editors=0010

您可以检查控制台的输出。

Sumeets 的回答是正确的,但只是想 post 我的香草解决方案。

var script = document.createElement('script');
script.src = "https://api.flickr.com/services/feeds/photos_public.gne?format=json";
document.getElementsByTagName('head')[0].appendChild(script);
var jsonFlickrFeed = function(data){
    console.log(data);
}