Geek asks and answers

Failed to execute jquery.ajax () method

Can someone tell me what could be wrong with this javascript?

        $.ajax({
            cache:false,
            url: 'http://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false',
            success: function(data, textStatus, jqXHR) {
                console.log('success');
                console.log(data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log('error');
                console.log(errorThrown);
                console.log(jqXHR);
            }
        });

The error event handler function is called, and this is my output to the console:

error
undefined
XMLHttpRequest { mozResponseArrayBuffer=ArrayBuffer, status=0, more...}

I'm trying to learn how to make ajax calls using jquery, and I'm still pretty new to this.

+3
source share
3 answers

I think you are making a request for a cross-domain that is blocked by your browser.

You can directly use the Maps API, which has convenient methods for such things.

Card Documentation

function codeAddress() {
  var address = document.getElementById("address").value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      var marker = new google.maps.Marker({
        map: map,
        position: results[0].geometry.location
      });
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}
+3
source

I only run this block of code through JSFiddle and get the same error.

however, when I go directly to the request URL, I get this JSON block:

{
  "status": "REQUEST_DENIED",
  "results": [ ]
}

Do you get the same?

0
source

  • , - Ajax - JSONP "" JSON CDR [ref].

  • However, the big problem here is that with the v3 API, Google has removed the ability to make JSONP requests (or at least it is not documented at the moment). Instead, they would rather use the Google Maps geocoder :

    var geocoder = new google.maps.Geocoder();
geocoder.geocode({
                'address': '1600+Amphitheatre+Parkway,+Mountain+View'
                 },

                 function(data, status){
                      console.log(data); //data is an array of results
                 });

At the moment, you can return to the v2 API if you absolutely must have Ajax geocoding, but do not want to use the geocoder built into the Google Maps JS library:

$.ajax({
    cache: false,

    url: 'http://maps.google.com/maps/geo?q=1600+Amphitheatre+Parkway,+Mountain+View,+CA&output=json&sensor=false&key=<your_key_here>',

    success: function(data, textStatus, jqXHR) {
        console.log('success');
        console.log(data); //geocoded data
    },

    error: function(jqXHR, textStatus, errorThrown) {
        console.log(textStatus);
        console.log(errorThrown);
        console.log(jqXHR);
    },

    jsonp: 'callback',

    dataType: 'json'
});
0
source

More articles:


All Articles