JQuery Ajaxで問題が発生しました。

Question

JSONを読み込もうとしてJQueryを使用していますが、エラーハンドラが終了します。私がDOMを調べると、それ以上の詳細がないstatusTextの下に "エラー"が表示されます。私はこれをローカルファイルに保存しようとしましたが、別の投稿に基づいて潜在的なMIME問題に対処するbeforeSendセクションを追加しました。ブラウザでURLを開くと、有効なJSONが生成されます。

$.ajax({ 
type : "GET", 
url : "http://maps.googleapis.com/maps/api/geocode/json?latlng=40.714224,-73.961452&sensor=true", 
beforeSend : function(x) { 
    if (x && x.overrideMimeType) {x.overrideMimeType("application/j-son;charset=UTF-8");}}, 
dataType : "application/json", 
success : function(data) { 
    alert("success" + data)}, 
error : function(y) {alert("failure" + y.statusText);} 

}）;

Answer 1

コードに問題はありません。この問題は、ドメイン間AJAX要求を実行しようとしているために発生しています。しかし、Googleがクライアント側のジオコーディングAPIであるGoogle Maps Javascript API V3 Servicesを提供しているため、すべてが失われるわけではありません。

以下の完全なコードサンプル（テスト済みのもの）を使用すると、必要なJSONオブジェクトにアクセスできます。この例では、アラートボックスには、最初のformatted_addressである「Williamsburg、NY、USA」が表示されます。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    var geocoder = new google.maps.Geocoder(); 
    var input = "40.714224,-73.961452"; 
    var latlngStr = input.split(",", 2); 
    var lat = parseFloat(latlngStr[0]); 
    var lng = parseFloat(latlngStr[1]); 
    var latlng = new google.maps.LatLng(lat, lng); 
    geocoder.geocode({ 'latLng': latlng }, function (results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      if (results[1]) { 
       alert(results[1].formatted_address); 
      } 
     } else { 
      alert("Geocoder failed due to: " + status); 
     } 
    }); 
}); 
</script>