我正在开发一个页面,通过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上提供服务。

其他回答

我在Chrome上也得到了同样的错误(我没有测试其他浏览器)。这是因为我在domain.com上导航,而不是www.domain.com。有点奇怪,但我可以通过在.htaccess中添加以下行来解决这个问题。它将domain.com重定向到www.domain.com,问题解决了。我是一个懒惰的网络访问者,所以我几乎从不输入www,但显然在某些情况下这是必需的。

RewriteEngine on
RewriteCond %{HTTP_HOST} ^domain\.com$ [NC]
RewriteRule ^(.*)$ http://www.domain.com/$1 [R=301,L]

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

最后一点,Mozilla文档明确说明了这一点

如果头是通配符,上面的例子将失败: Access-Control-Allow-Origin: *。由于Access-Control-Allow-Origin明确提到http://foo.example, 凭证识别内容返回给调用web 内容。

因此,使用'*'不仅仅是一个坏习惯。根本不管用:)

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

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

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

我们通过HTTP .conf文件管理它(编辑并重新启动HTTP服务):

<Directory "/home/the directory_where_your_serverside_pages_is">
    Header set Access-Control-Allow-Origin "*"
    AllowOverride all
    Order allow,deny
    Allow from all
</Directory>

在头集Access-Control-Allow-Origin "*"中,可以放置精确的URL。