How does paging in facebook javascript API work?

Question

I\'m trying to recover the last week posts in my facebook news feed with the javascript sdk. I\'m able to get the first page but then, I don\'t know how to continue iteratin

Answer 1

The key constraint in your question is we can't use the 'next' url provided in the response.

I'll try to answer your question by first asking a more general question:

How can we create a user experience for our Facebook app where every call for more items returns the same amount of items.

If the user requests 'more' and gets 10 items, presses 'more' and gets then 4, then 7 etc, she might think our app is buggy.

On the Open Graph intro page, different parameters for paging are introduced. These are:

limit

offset

until

since

as mentioned under the 'paging' heading. However if we implement a solution with limit and offset where we increment offset ,e.g.:

https://graph.facebook.com/me/home?limit=10&offset=OFFSET

where OFFSET will be increased by the limit each request, we find that the number of results returned will sometimes not be equal to the “limit” parameter we specified. This is because parameters are applied on Facebook's side before checking if the queried results are visible to the viewer. We ask for 10, but we might get 8 items in return.

This means we can't use a solution where we increment limit and offset if we want our app's 'more' request to always return the same amount of items.

A solution proposed in this blog by Jeff Bowen (who works on the Facebook plaform team) is this logic:

• request item with limit = YOUR_LIMIT.
• retrieve the created_time field of the last item in the response.
• request next 10 items with since = RETRIEVED_CREATED_TIME and limit=YOUR_LIMIT

Here's a code sample, based on an example in the blog post mentioned above:

var graphURL = "https://graph.facebook.com/me/home?" +
                 "callback=processResult&" +
                 "date_format=U&" +
                 "limit=10";

function loadPosts() {
  var script = document.createElement("script");
  script.src = graphURL;
  document.body.appendChild(script);
}

function processResult(posts) {
  if (posts.data.length == 0) {
    document.getElementById("loadMore").innerHTML =
      "No more results";
  }
  else {
    graphURL = graphURL + "&until=" +
      posts.data[posts.data.length-1].created_time;

    for (var post in posts.data) {
      var message = document.createElement("div");
      message.innerHTML = posts.data[post].message;
      document.getElementById("content").appendChild(message);
    }
  }
}
    

This solution retrieves the next 10 items from the user's newsfeed in chronological order without using the url in the JSON response.