如果我将以下 URL 粘贴到浏览器选项卡中:
https://maps.googleapis.com/maps/api/place/search/json?location=51.5237587%2C-0.1583642&radius=500&types=bar&key=MY_KEY_HERE&sensor=false
...我从 Google Places API 获得了预期的 JSON 响应(MY_KEY_HERE 当然被替换为实际的 key ，在此处和下面的 .ajax() 中)。然而，当使用这个 jQuery.ajax() 构造时:
$.ajax({
type: 'GET',
url: "https://maps.googleapis.com/maps/api/place/search/json",
data: {"location" : latlng, "radius" : 500, "types" : "bar", "key" : "MY_KEY_HERE", "sensor" : "false",},
dataType: "json",
success: function(data)
{
var pubResults = data;
},
error: function(data)
{
alert(JSON.stringify(data));
},
complete: function(data)
{
initialize($.oneapi.latitude, $.oneapi.longitude, pubResults);
}
});
...则未到达 success block ，而是 error block 输出:
{"readyState":0,"responseText":"","status":0,"statusText":"error"}
在 Firefox 5.01 中测试。 Web 控制台确认 .ajax() 正在获取此问题顶部提到的 URL。任何想法为什么 jQuery 调用该 URL 会导致错误，但粘贴到浏览器选项卡中的相同 URL 会产生预期的 JSON？
非常感谢您抽出时间!
最佳答案
这是一个跨域请求。默认情况下，浏览器会阻止来自跨域站点的响应。您需要使用 jsonp 作为数据类型。只要用 google 搜索一下，你就可以看到如何使用 jquery API 来完成它。堆栈溢出也有关于这些的问题。
在同源策略下，由server1.example.com提供的网页无法正常连接或与server1.example.com以外的服务器通信。 HTML 元素是一个异常(exception)。利用元素的开放策略，某些页面使用它们来检索对来自其他来源的动态生成的 JSON 格式数据进行操作的 Javascript 代码。这种使用模式称为 JSONP。
关于jquery - Google Places API jQuery.ajax() 请求因工作 URL 而失败，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7076257/