6

Im trying out the new graph api for facebook. I'm trying to fetch some data using jquery ajax. This is a sample of my javascript code, very basic...

var mUrl = 'https://graph.facebook.com/19292868552';
   $.ajax({
        url: mUrl,
        dataType: 'json',
        success: function(data, status) {
          $('#test').html(data);
          alert(data);

      },
      error: function(data, e1, e2) {
        $('#hello').html(e1);  
      }
   });

The url is to a page that does not need access tokens (try it using a browser), but the success function returns an empty object or null.

What am I doing wrong? Thankful for all help!

0

4 Answers 4

10

I have covered this and asked this question before. I made a quick tutorial which covers exactly this and explains it all.

In short: JSON is not made for cross domain usage according to its same-origin policy. However the work around is to use JSONP which we can do in jQuery using the supported callback parameter in facebook's graph api. We can do so by adding the parameter onto your url like

https://graph.facebook.com/19292868552?callback=?

by using the callback=? jQuery automatically changes the ? to wrap the json in a function call which then allows jQuery to parse the data successfully.

Also try using $.getJSON method.

1
  • I think its important to note that the Facebook graph API does support JSONP enabling this to work. Commented Dec 31, 2012 at 20:32
4

I was trying to do something similar, in testing I was able to get a working result which I saved on jsFiddle: http://jsfiddle.net/8R7J8/1/

Script:

var facebookGraphURL = 'https://graph.facebook.com/19292868552';
$.ajax({
    url: facebookGraphURL,
    dataType: 'json',
    success: function(data, status) {
      $( '#output' ).html('Username: ' + data.username);
    },
    error: function(data, e1, e2) {
      $( '#output' ).html(e2);
    }
})

HTML:

<html>
  <body>
    <div id="output">BorkBorkBork</div>
  </body>
</html>

Hope that helps! :)

1

...The Graph API supports JSONP. Simply pass callback=methodname as an extra parameter and the returned content will be wrapped in a function call, allowing you to use a dynamically inserted script tag to grab that data. http://forum.developers.facebook.com/viewtopic.php?pid=253084#p253084

0

You can't do cross-domain AJAX requests like that due to the same-origin policy. Instead, use Facebook's JavaScript SDK, which is based on a script tag.

2
  • It's not crossdomain related . I can see the json data from Facebook using a network analyzer (wireshark) This thread is about similar problem stackoverflow.com/questions/2387271/… Maybe is related to gzip , but not sure even about that ... i have a similar call to youtube var url="gdata.youtube.com/feeds/api/…"; and it works despite the same gzip encoding as facebook call Commented Jul 25, 2010 at 13:49
  • well ... after some hour of investigation i'm even more confused :) if Firefox implements same-origin policy by hiding responseText then it can be that (im going to give you back the 1 point as 24h passed) Commented Jul 26, 2010 at 11:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.