带有 Yahoo YUI 3 的 Google 地理编码 ajax 请求答案

【问题标题】：Google Geocoding ajax request with Yahoo YUI 3带有 Yahoo YUI 3 的 Google 地理编码 ajax 请求
【发布时间】：2013-01-24 18:12:21
【问题描述】：

我了解在 YUI 3 中进行 ajax 调用的方法是使用 IO 实用程序。我想从 Google 的地理编码 API 中获取某个位置的地址。

<script type="text/javascript"><!--
YUI().use('io-base', function(Y) {
    function complete(id, o) {
        var data = o.responseText; // Response data.
        alert(o.responseText);
    };

    Y.on('io:complete', complete, Y);
    var request = Y.io("http://maps.googleapis.com/maps/api/geocode/json?language=en&sensor=false&latlng=12,34);
});
//-->
</script>

我收到回复，方法是 OPTIONS 和状态代码 405 Method Not Allowed。我相信这是因为一些“预检”权限检查。我没有收到想要的回复。如果我将 url 复制并粘贴到浏览器中，我会看到 json 数据。

我可以将 ajax 请求发布到我自己域上的 php 脚本中，并使用 curl 获取 json 响应。但是，如果我可以在 javascript 中获取数据，为什么还要有这个额外的步骤呢？

那么我能做些什么来解决这个问题呢？ IO 实用程序不适合使用吗？

【问题讨论】：

标签： javascript ajax io yui geocoding

【解决方案1】：

您正在发出跨域 XHR 请求，并遇到“同源策略”，这是客户端 JavaScript 中的一般限制。参见例如Why do I still receive 405 errors even though both URLs are from XXXX.com?

有多种方法可以解决这个问题：

1) 按照您的建议，在 PHP 中发出服务器端请求 2) 使用 YUI jsonp 模块 3) 使用 YUI YQL 模块，它通过 Yahoo! 代理您的请求！服务器并为您处理 JSONP 内务

还有很多其他方法可以解决这个问题，但这三种方法应该可以帮助您入门。

【讨论】：

谢谢！我会考虑使用 jsonp。

【解决方案2】：

Y.io 支持跨域请求。见http://yuilibrary.com/yui/docs/io/#cross-domain-transactions

你需要用“xdr”属性正确配置它，并加载“io-xdr”模块等。这个例子也使用它：http://yuilibrary.com/yui/docs/io/weather.html

【讨论】：