对于运行于// URL文件的应用程序的请求，出现" Origin null is not allowed by Access-Control-Allow-Origin "错误

我正在开发一个页面，通过jQuery的AJAX支持从Flickr和Panoramio提取图像。

Flickr端工作正常，但当我尝试$。get(url，回调)从全景，我看到一个错误在Chrome的控制台:

XMLHttpRequest无法加载http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&callback=processImages&minx=-30&miny=0&maxx=0&maxy=150。Access-Control-Allow-Origin不允许原点为空。

如果我直接从浏览器中查询该URL，它可以正常工作。这是怎么回事，我能回避吗?我是否错误地编写了我的查询，或者这是Panoramio所做的阻碍我试图做的事情?

谷歌在错误消息中没有找到任何有用的匹配。

EDIT

下面是一些显示问题的示例代码:

$().ready(function () {
  var url = 'http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&callback=processImages&minx=-30&miny=0&maxx=0&maxy=150';

  $.get(url, function (jsonp) {
    var processImages = function (data) {
      alert('ok');
    };

    eval(jsonp);
  });
});

您可以在线运行示例。

编辑2

谢谢达林的帮助。上面的代码是错误的。用这个代替:

$().ready(function () {
  var url = 'http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&minx=-30&miny=0&maxx=0&maxy=150&callback=?';

  $.get(url, function (data) {
    // can use 'data' in here...
  });
});

当前回答

CodeGroover上面发布的解决方案中有一个小问题，即如果更改了一个文件，则必须重新启动服务器才能实际使用更新后的文件(至少在我的情况下是这样)。

所以搜索了一下，我找到了这个用法:

sudo npm -g install simple-http-server # to install
nserver # to use

然后它将在http://localhost:8000上提供服务。

2013-06-06 23:15:38

其他回答

你可能需要在你调用的脚本中添加一个HEADER，这是我在PHP中必须做的:

header('Access-Control-Allow-Origin: *');

更多细节在跨域AJAX ou services WEB(法语)。

2011-02-11 10:59:17

确保您使用的是最新版本的JQuery。我们在JQuery 1.10.2中遇到过这个错误，在使用JQuery 1.11.1后这个错误得到了解决

2014-07-10 06:32:30

只要请求的服务器支持JSON数据格式，就可以使用JSONP (JSON Padding)接口。它允许您在没有代理服务器或花哨的报头的情况下进行外部域请求。

2011-05-06 16:27:50

适用于我的谷歌Chrome v5.0.375.127(我得到警报):

$.get('http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&callback=?&minx=-30&miny=0&maxx=0&maxy=150',
function(json) {
    alert(json.photos[1].photoUrl);
});

另外，我建议你使用$.getJSON()方法，因为前面的方法在IE8上不起作用(至少在我的机器上):

$.getJSON('http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&callback=?&minx=-30&miny=0&maxx=0&maxy=150', 
function(json) {
    alert(json.photos[1].photoUrl);
});

你可以从这里上网试试。

更新:

现在你已经展示了你的代码，我可以看到它的问题。您同时拥有匿名函数和内联函数，但它们都将被称为processImages。这就是jQuery的JSONP支持的工作方式。注意到我是如何定义callback=?这样你就可以使用匿名函数。您可以在文档中阅读更多关于它的信息。

另一个注释是你不应该调用eval。传递给匿名函数的参数已经被jQuery解析为JSON。

2010-08-29 16:14:53

对于一个简单的HTML项目:

cd project
python -m SimpleHTTPServer 8000

然后浏览您的文件。

2012-03-07 15:49:55

对于运行于// URL文件的应用程序的请求，出现" Origin null is not allowed by Access-Control-Allow-Origin "错误

推荐文章

最新文章

标签