web-dev-qa-db-ja.com

クロスドメインを作成する方法AJAX Google Maps APIの呼び出し？

JQueryを作成しようとしています$.getJSONGoogle Maps Geocoding webservice を呼び出しますが、クロスドメインセキュリティの問題のため、これは機能しません。

私はそれをオンラインで理解することができませんでしたが、Google Javascript APIまたはJSONPについて少し読みましたが、今のところ明確な答えはありません...

誰でも私を啓発できますか？

ありがとう！

javascriptgoogle-mapscross-domainjsonpgoogle-maps-api-3
43
Pierre Duplouy

Google MapsがJavaScript用のフル機能の クライアント側ジオコーディングAPI を提供する場合、 サーバー側ジオコーディングWebサービス を使用しても利点はありません。

まず第一に、これは同じ起源の問題を自動的に解決し、さらにリクエスト制限はサーバーIPアドレスごとではなくクライアントIPアドレスごとに計算されるため、人気のあるサイトで大きな違いを生む可能性があります。

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>

何らかの理由でサーバー側のWebサービスを使用したい場合は、Apacheを使用している場合は mod_proxy を使用して、非常に単純な reverse proxy を設定できます。これにより、AJAXリクエストに相対パスを使用できますが、HTTPサーバーは「リモート」ロケーションへのプロキシとして機能します。

Mod_proxyでリバースプロキシを設定するための基本的な設定ディレクティブはProxyPassです。通常、次のように使用します。

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

この場合、ブラウザは/geocode/output?parametersしかし、サーバーはhttp://maps.google.com/maps/api/geocode/output?parameters。

88
Daniel Vassallo