JavaScript跨域中的Flickr JSON返回错误
JavaScript跨域中的Flickr JSON返回错误
提问于 2018-03-14 06:04:03
我有这段代码，我试图返回FlickrAPI，但是我得到了以下错误。
跨源请求被阻止：相同的原产地策略不允许在
可以通过将资源移动到相同的域或启用CORS来解决这个问题。
如何在代码中启用此功能？
enter
MyFeed.prototype.getFeed = function(data) {
console.log(f.feedUrl);
var request = new XMLHttpRequest();
request.open('GET', f.feedUrl, true);
request.onload = function () {
if (request.status >= 200 && request.status < 400) {
// Success!
console.log(request.responseText);
var data = JSON.parse(request.responseText);
} else {
// We reached our target server, but it returned an error
console.log("error");
}
};
request.onerror = function () {
// There was a connection error of some sort
};
request.send();
}here回答 2
Stack Overflow用户
发布于 2018-03-14 14:25:08
由于这是使用JSONP，因此你不用于XMLHttpRequest检索资源，而是script使用适当的src URL 注入元素，并jsoncallback为脚本加载后将调用的参数定义一个名称相同的名称的函数：
function handleTheResponse(jsonData) {
console.log(jsonData);
}
// ... elsewhere in your code
var script = document.createElement("script");
script.src = f.feedUrl;
document.head.appendChild(script);
只要确保你有jsoncallback=handleTheResponse（或者任何你称之为你的方法），确保该方法是全球可访问的
这里有一个演示：
function handleTheResponse(data) {
document.getElementById("response").textContent = JSON.stringify(data,null,2);
}
var script = document.createElement("script");
script.src = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=handleTheResponse&tags=london&tagmode=any&format=json"
document.head.appendChild(script);
<pre id="response">Loading...</pre>Stack Overflow用户
发布于 2018-03-14 15:47:51
有多种方法可以解决它，一个简单的方法就是使用jQuery;
假设回调
http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback={callback}&tags=london&tagmode=any&format=json
回调= “jQuery111203062643037081828_1446872573181”
enter
MyFeed.prototype.getFeed = function(data) {
$.ajax({
url: f.feedUrl,
dataType : "jsonp",
success: function(response) {
console.log(response);
},
error: function (e) {
console.log(e);
}
});
}here
或者如果你想要没有jQuery，这与@ daniel-flint推荐的相同。
function jsonp(url, callback) {
var callbackName = 'jsonp_callback_' + Math.round(100000 * Math.random());
window[callbackName] = function(data) {
delete window[callbackName];
document.body.removeChild(script);
callback(data);
};
var script = document.createElement('script');
script.src = url + (url.indexOf('?') >= 0 ? '&' : '?') + 'callback=' + callbackName;
document.body.appendChild(script);
}
jsonp('http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=callback&tags=london&tagmode=any&format=json', callback);
function callback(data){
console.log(data);
}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/-100004253
复制相关文章
相似问题