Javascript 如何对 Google Maps API 进行跨域 AJAX 调用?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2921745/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 02:29:50  来源:igfitidea点击:

How to make cross-domain AJAX calls to Google Maps API?

javascriptgoogle-mapscross-domainjsonpgoogle-maps-api-3

提问by Pierre Duplouy

I'm trying to make a jQuery $.getJSONcall to the Google Maps Geocoding webservice, but this doesn't work because of cross-domain security issues.

我正在尝试对Google Maps Geocoding webservice进行 jQuery$.getJSON调用,但由于跨域安全问题,这不起作用。

I haven't been able to figure it out online, but I've read a bit about Google Javascript API or JSONP, but so far no clear answer...

我一直无法在网上弄明白,但我已经阅读了一些关于 Google Javascript API 或 JSONP 的内容,但到目前为止还没有明确的答案......

Could anyone enlight me?

有人可以启发我吗?

Thanks!

谢谢!

回答by Daniel Vassallo

I can see no advantage in using the Server-side Geocoding Web Servicewhen Google Maps provides a full featured Client-side Geocoding APIfor JavaScript.

当 Google Maps为 JavaScript提供功能齐全的客户端地理编码 API 时,我看不出使用服务器端地理编码 Web 服务的优势。

First of all, this automatically solves your same-origin problem, and in addition the request limits would be calculated per client IP address instead of of per server IP address, which can make a huge difference for a popular site.

首先,这会自动解决您的同源问题,此外,请求限制将按客户端 IP 地址计算,而不是按服务器 IP 地址计算,这对于流行站点来说可能会产生巨大的差异。

Here's a very simple example using the JavaScript Geocoding API v3:

这是一个使用 JavaScript Geocoding API v3 的非常简单的示例:

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">     
   var geocoder = new google.maps.Geocoder();
   var address = 'London, UK';

   if (geocoder) {
      geocoder.geocode({ 'address': address }, function (results, status) {
         if (status == google.maps.GeocoderStatus.OK) {
            console.log(results[0].geometry.location);
         }
         else {
            console.log("Geocoding failed: " + status);
         }
      });
   }    
</script>

If for some reason you still want to use the server-side web-service, you could set up a very simple reverse proxy, maybe using mod_proxyif you are using Apache. This would allow you to use relative paths for your AJAX requests, while the HTTP server would be acting as a proxy to any "remote" location.

如果出于某种原因您仍然想使用服务器端 Web 服务,您可以设置一个非常简单的反向代理,如果您使用的是 Apache ,可以使用mod_proxy。这将允许您为 AJAX 请求使用相对路径,而 HTTP 服务器将充当任何“远程”位置的代理。

The fundamental configuration directive to set up a reverse proxy in mod_proxy is the ProxyPass. You would typically use it as follows:

在 mod_proxy 中设置反向代理的基本配置指令是 ProxyPass。您通常会按如下方式使用它:

ProxyPass     /geocode/     http://maps.google.com/maps/api/geocode/

In this case, the browser could make a request to /geocode/output?parametersbut the server would serve this by acting as a proxy to http://maps.google.com/maps/api/geocode/output?parameters.

在这种情况下,浏览器可以向 发出请求,/geocode/output?parameters但服务器将通过充当 的代理来提供服务http://maps.google.com/maps/api/geocode/output?parameters