How to get (in object) Facebook data?

1

I'm creating a Feed (dynamic content list) with the contents of a Facebook group's wall. I know there are some features that Facebook itself provides, such as the Social Plugin - Like Box . After a few tests, I saw some difficulties handling the CSS of the Plugin . In the future I will adapt Feed to receive from Twitter also so I would like to differentiate the posts from each with the logo of the same. Seeing that this purpose is very specific not only in functionalities, but also comes in the Design already being ready, I found it better to just get the objects (think with JS) and with JS display them in my < in> Feed that is already ready. Any ideas?

    
asked by anonymous 27.02.2014 / 19:35

2 answers

3

From what I understand of your question, you need to make use of the Facebook API to collect data and / or the feed of a given user by receiving them in the form of an object.

If you make a HTTP Get to the address graph.facebook.com with parameters appropriate to what you want and a valid access Token, you will get back a JSON object with the desired information.

There are three types of data that fall into what is called feed , which leads you to use the appropriate link for what you want to collect, so you can HTTP Get and collect the information:

  • Status updates status updates

    http://graph.facebook.com/IdUtilizador/statuses?access_token=TokenDeAcessoValido
    
  • List of items on the user wall wall stream

    http://graph.facebook.com/IdUtilizador/wall?access_token=TokenDeAcessoValido
    
  • List of items in the user home home feed

    http://graph.facebook.com/IdUtilizador/home?access_token=TokenDeAcessoValido
    

The Facebook documentation for this subject may be found .

The information received is a JSON that is an object thus giving account of your problem.

Example in JSFiddle

Below is an example of the data format we received:

{
   "id": "220439",
   "name": "Bret Taylor",
   "first_name": "Bret",
   "last_name": "Taylor",
   "link": "http://www.facebook.com/btaylor",
   "gender": "male",
   "locale": "en_US",
   "username": "btaylor"
}

The usage is relatively simple:

var endereco = "http://graph.facebook.com/btaylor";
$.getJSON(endereco, function(data) {
    var name = data["name"];
    $("#meuElemento").append("<h3>"+name+"</h3>"); 
});

There are also other examples of information that can be collected in the form of objects. On this page (English) , among many are the ones I mentioned above .

Facebook Query Language (FQL)

Using the Facebook query language, you can perform the same SQL queries and collect the data in a more practical and non-junk way:

On the Overview (English) page, they have a series of examples, but we'll collect the name as illustrated above:

var endereco = "http://graph.facebook.com/";
var consulta = "fql?q=SELECT name FROM user WHERE uid = me()";
var tokenAcesso = "&access_token=XXXX";

$.getJSON(endereco+consulta+tokenAcesso, function(data) {
    var name = data["name"];
    $("#meuElemento").append("<h3>"+name+"</h3>"); 
});

Queries can be tested in Graph Explorer (English) .

    
27.02.2014 / 20:26
0

You will have difficulty changing the plugin's css because the content will be inside an iframe.

You'd have to use the FaceBook JavaScript SDK

Reading content from a fanpage:

FB.api('/113124472034820', function(response) {
  console.log(response);
});

Picking up user data:

FB.api('/me', {fields: 'last_name'}, function(response) {
  console.log(response);
});

Posting content:

var body = 'Reading JS SDK documentation';
FB.api('/me/feed', 'post', { message: body }, function(response) {
  if (!response || response.error) {
    console.log('Error');
  } else {
    console.log('Post ID: ' + response.id);
  }
});
    
27.02.2014 / 20:14