我有这段代码,我试图返回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
发布于 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>
发布于 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);
}
https://stackoverflow.com/questions/-100004253
复制相似问题