Search code examples
ajaxjquerygravatar

Gravatar VS JQuery Ajax... help?


I want to include a function on my page, that checks whether the user has a Gravatar account with their email. If yes, they should have that picture displayed, if not they should be given other options.

I'm trying to do this as follows:

  $.ajax({
      url: 'https://secure.gravatar.com/' + md5(user.email) + '.json',
      method: 'GET',
      timeout: 4000,
      success: function successFn() {
          doGravatarStuff();
      },
      error: function errorFn(response, status, error) {
          console.log(response.status); //debug
      }
  });

This always returns an error status of 0 on Internet Explorer and I can't seem to figure out why. I tried changing the 'dataType' to 'json', 'html' etc but that doesn't seem to help.

Also, and maybe that is a related problem, if I test this on FF or Crome, with a user that really doesn't have an account, it returns a 404-error according to the 'net' tab readout

404 Not Found 649ms

but 'response.status' still seems to be 0

Any ideas anyone? Thanks so much in advance!!


Solution

  • Normally cross-domain AJAX requests are denied because it's a security thing. See this blog article: http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/

    Did you try the jsonp dataType? I use jsonp when I access twitter's tweet json feed.

    Example:

    var urls = "http://twitter.com/status/user_timeline/" + username + ".json?count=" + pageSize + "&page=" + currentPage;
    
      $.ajax({
        beforeSend: function () {
          $("#ajax-load").fadeIn()
        },
        url: urls,
        cache: true,
        type: 'GET',
        dataType: 'jsonp',
        success: twitterCallback2
      });
    
      };