Whats the JQuery equivalent to the following PHP code? (JSON)

Question

I got the following code in PHP:

<?php
$json = file_get_contents('https://graph.facebook.com/192655950766049');
$data = json_decode($json, true);
echo $data['description'];
?>

and I want the equivalent code in JQuery. I tried to do it myself but I had no luck. Here's one of my many tries:

<script type="text/javascript" src="../scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
$.getJSON("https://graph.facebook.com/192655950766049", function(json) {
   alert("JSON Data: " + json.description);
 });
</script>

I read the explanation from http://api.jquery.com/jQuery.getJSON/, but yet I dont really understand it..

anyway, if you can help me it'll be very nice!

Thanks

I think it's not possible to eastablish a SSL encrypted connection using jQuery (https!!) Second problem is Same Origin Policy (SOP) http://en.wikipedia.org/wiki/Same_origin_policy — sled, Mar 04 '11 at 23:59
@sled, ajax calls are performed using the current scheme. If it's SSL or not it doesn't matter. — Kevin Peno, Mar 05 '11 at 00:17

score 3 · Answer 1 · answered Mar 05 '11 at 00:01

3

You're violating the Same origin policy by requesting a different domain with Javascript. You'll need to do this server side (i.e. with PHP in your case).

answered Mar 05 '11 at 00:01

wsanville

37,158
8
76
101

Understood. Thank you for the information. Btw, can I run JQuery getJSON on my php page (that will get the information using php geyJSON)? – Ron Mar 05 '11 at 00:10
Correct, if you really want this loaded dynamically, you can request a php page on your same domain with Javascript, and that page can make a request to Facebook and return the results. – wsanville Mar 05 '11 at 00:19
Or use jsonp instead to get around the same origin limitation. – Kevin Peno Mar 05 '11 at 00:24

score 2 · Accepted Answer · answered Mar 05 '11 at 00:22

2

You need to use jquery's jsonp request. See this short discussion on how to interface with facebook using this. JSONP allows for XSS ignoring the same origin policy.

Basically your code would then look similar to this:

<script type="text/javascript" src="../scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
$.getJSON("https://graph.facebook.com/192655950766049?callback=?", function(json) {
   alert("JSON Data: " + json.description);
 });
</script>

answered Mar 05 '11 at 00:22

Kevin Peno

9,107
1
33
56

so basiclly JSONP solves everything for me. thank you very much. – Ron Mar 05 '11 at 00:34
btw, I didnt understand, Do I need to make PHP file or I can use your code and thats it? – Ron Mar 05 '11 at 01:09

score 1 · Answer 3 · edited May 23 '17 at 12:04

1

$(document).ready(function(){ 
  var url = "https://graph.facebook.com/192655950766049?limit=3&callback=?";
  $.getJSON(url,function(json){
    var html = "<ul>";
    $.each(json.data,function(i,fb){
      html += "<li>" + fb.message + "</li>"; 
    });
    html += "</ul>";
    $('.facebookfeed').html(html);
  });
});

You can also check this url. http://www.prettyklicks.com/blog/making-a-facebook-feed-using-the-graph-api-json-and-jquery/291/

Also check this link using the same method as i have specified. using $.getJSON within a loop

edited May 23 '17 at 12:04

Community

1
1

answered Mar 05 '11 at 00:00

Hussein

42,480
25
113
143

thanks to wsanville I understood that I am violating "Same origin policy" and therfore I'll have to use php in this case. Unless I can get the data in php and then getJSON on my own php file. – Ron Mar 05 '11 at 00:12
I see you edited your answer just as I was posting about jsonp. Crap! – Kevin Peno Mar 05 '11 at 00:22

score 1 · Answer 4 · answered Mar 05 '11 at 00:01

1

You won't be able to directly download data from facebook on the client side due to cross site scripting limitations.

answered Mar 05 '11 at 00:01

Paul Creasey

28,321
10
54
90

score 0 · Answer 5 · answered Dec 04 '20 at 22:12

In the event anyone is interested in using jquery locally IE: WAMP, here is a tested example.. The z.txt file it is reading has a simple single number in it..

<script type="text/javascript" src="jquery-1.7.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $.getJSON("z.txt", function(json) {
        alert(json);
    });
});
</script>

Whats the JQuery equivalent to the following PHP code? (JSON)

5 Answers5