Comment pagination dans le facebook de l'API javascript de travail?

Je suis en train de récupérer la dernière semaine de postes dans mon facebook flux d'actualités avec le sdk javascript.
Je suis en mesure d'obtenir la première page, mais ensuite, je ne sais pas comment continuer à itérer sur les autres pages. J'ai essayé avec le code suivant:

 $('#loadPosts').bind('click', function() {     
            FB.api('/me/home',{since:'last week'}, getPosts);   
          });

 getPosts = function(response){
        for (element in response.data){
            post = response.data[element]
            console.log(post);          
          }

          previousPage = response.paging.previous;        
          console.log(previousPage);

          //can i call FB.api(previousPage, getPosts); ??      

      }

Mais je suis un URL de la page précédente et je ne sais pas comment faire un javascript FB.les appels de l'api à partir de cette URL. Des idées?

veuillez consulter la stackoverflow.com/questions/17416787/...
Oui, vous pouvez faire ce que vous vous attendiez à être vrai: FB.api(previousPage, getPosts);

InformationsquelleAutor Fgblanch | 2011-02-17

Bien, il semble que beaucoup de pleurnicher sur une question simple, que je crois toujours que mon ancienne réponse précise. De toute façon, permettez-moi de garder des enfants vous. 🙂

Première: je trouve que vous ne pouvez pas vraiment aller à la "précédente" de la page à partir de la première page. Idéalement, je devrais. Donc, voici un bug que j'ai déposé, vous pouvez suivre: https://developers.facebook.com/bugs/391562790938294?browse=search_50fcac3ce094e7068176315

Deuxième: Si c'est par la conception, vous ne pouvez pas revenir à "précédent" de la première page (car il y a est pas de précédent), mais vous pouvez certainement aller pour "Suivant". Cependant, depuis l'API se comporte comme un curseur, et que vous avez déplacé vers l'avant, maintenant, votre "précédent" page ne fonctionne.

La réponse à la question:

Je suis un URL de la page précédente et je ne sais pas comment faire un javascript FB.les appels de l'api à partir de cette URL. Des idées?

oui, vous pouvez faire des FB.les appels de l'api. Mais je vous suggère de faire un appel HTTP GET à la place, parce que c'est plus facile. Notez également que, en mai dernier retour et tableau vide comme {"data":[]}

Comment obtenir la page précédente/suivante?

Ici, je suis en train d'écrire un petit code qui utilise jQuery. Dans le cas où vous ne voulez pas lire le code, il y a deux façons:

Utilisez les boutons précédent/suivant URL et de faire des requête HTTP GET. Qui, si elle n'est pas vide, viendra avec la prochaine série de "précédent", "suivant" lien.
Analyser l'URL, et d'obtenir la chaîne de la requête JSON sna passer à FB.api. J'ai utilisé jQuery BARBECUE pluging pour l'analyse.

Remarque importante: Dans l'exemple, je suis en utilisant des "à côté" de l'URL parce que sur la première demande si j'utilise "précédent", il donne à vide JSON au lieu de donner des postes à partir du passé. Cependant, je peux utiliser "précédent" de l'URL une fois que j'ai déménagé à l'avance quelques pages. Comme les résultats de Google, vous ne pouvez pas aller à la page précédente 1, mais vous pouvez à partir de n'importe quelle page > 1 (voir l'Exemple 3 ci-dessous). Cela s'appelle de la pagination.

Exemple 1: Code à l'aide de HTTP GET (de préférence): (je vais charger 3 postes/page et de regarder les trois prochaines pages)

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" src="https://raw.github.com/cowboy/jquery-bbq/master/jquery.ba-bbq.min.js"></script>
<script>

var i =0;
var getPosts = function (response){
          for (element in response.data){
            post = response.data[element]
            console.log(post.id + ": " +post.message);          
          }



          //can i call FB.api(nextPage, getPosts); ??
          if(i < 2){
              nextPage = response.paging.next;        
              console.log(nextPage);
              i++;
              //Method 1: I use it.
              $.get(nextPage, getPosts, "json"); //optional: $.getJSON can be use instead
          }

      }

$(document).ready(function(){

$('#loadPosts').bind('click', function() {
            FB.api('/me/home',{since:'yesterday','limit': '3'}, getPosts);   
          });
})
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    //init the FB JS SDK
    FB.init({
      appId      : 'XXXXXXXXXXXX', //FILL YOUR APP ID HERE!
      status     : true, //check the login status upon init?
      cookie     : true, //set sessions cookies to allow your server to access the session?
    });

    //Additional initialization code such as adding Event Listeners goes here

  };
</script>
<button id="loadPosts">Load Posts</button>
<p>Please open developer console to see what's happening. In Firefox, you can use ctrl+shift+k, and in Chrome/Chromium use ctrl+shift+i</p>
</body>
</html>

Réponse:

100004192352945_156620584487686: undefined
137723270230_10152423499430231: On this day, please spare a thought for those fellow citizens, for whom I just spare a thought and do nothing else.
642965867_10151211036740868: Thanks everyone for their wishes! The wishes made my day!

https://graph.facebook.com/677811901/home?limit=3&access_token=AAACYjXGS5FQBAIR3brc2LibjBcZCi2kRJUybG8VMaaJSZARQ8SzNE7BE4PBrDIFVZB0AaVEa1dZCpX1fhCvoD2rnq8uc8OGaIFhO9uvVXAZDZD&until=1359184568
367116489976035_536776529676696: Rage. Quit. Life.
899605553_10152450871820554: undefined
367116489976035_417820828298092: undefined

https://graph.facebook.com/677811901/home?limit=3&access_token=AAACYjXGS5FQBAIR3brc2LibjBcZCi2kRJUybG8VMaaJSZARQ8SzNE7BE4PBrDIFVZB0AaVEa1dZCpX1fhCvoD2rnq8uc8OGaIFhO9uvVXAZDZD&until=1359179890
137723270230_10152423148745231: Pratibha Patil used to love the Republic Day Parade, especially the part where the visiting Chief Guest extended her an invitation to visit his/her own country.
137723270230_10152423131700231: The Kingfisher tableau at Republic Day Parade was so simple. Vijay Mallya riding a bicycle.
367116489976035_484460034950769: undefined

Exemple 2: Code à l'aide de FB.api: (je vais charger 3 postes/page et de regarder les trois prochaines pages)

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" src="https://raw.github.com/cowboy/jquery-bbq/master/jquery.ba-bbq.min.js"></script>
<script>
var i =0;
var getPosts = function (response){
for (element in response.data){
post = response.data[element]
console.log(post.id + ": " +post.message);          
}
//can i call FB.api(nextPage, getPosts); ??
if(i < 2){
nextPage = response.paging.next;        
console.log(nextPage);
i++;
//Method 2: If you have to call FB.api
var params = jQuery.deparam.querystring(nextPage);
console.log(JSON.stringify(params, null, 2));
FB.api('/me/home', params, getPosts)
}
}
$(document).ready(function(){
$('#loadPosts').bind('click', function() {
FB.api('/me/home',{since:'yesterday','limit': '3'}, getPosts);   
});
})
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
//init the FB JS SDK
FB.init({
appId      : 'XXXXXXXXXXXX', //FILL YOUR APP ID HERE!
status     : true, //check the login status upon init?
cookie     : true, //set sessions cookies to allow your server to access the session?
});
//Additional initialization code such as adding Event Listeners goes here
};
</script>
<button id="loadPosts">Load Posts</button>
<p>Please open developer console to see what's happening. In Firefox, you can use ctrl+shift+k, and in Chrome/Chromium use ctrl+shift+i</p>
</body>
</html>

Réponse:

367116489976035_536776529676696: Rage. Quit. Life.
899605553_10152450871820554: undefined
367116489976035_417820828298092: undefined
{
"limit": "3",
"access_token": "AAACYjXGS5FQBAIR3brc2LibjBcZCi2kRJUybG8VMaaJSZARQ8SzNE7BE4PBrDIFVZB0AaVEa1dZCpX1fhCvoD2rnq8uc8OGaIFhO9uvVXAZDZD",
"until": "1359179890"
}
137723270230_10152423148745231: Pratibha Patil used to love the Republic Day Parade, especially the part where the visiting Chief Guest extended her an invitation to visit his/her own country.
137723270230_10152423131700231: The Kingfisher tableau at Republic Day Parade was so simple. Vijay Mallya riding a bicycle.
367116489976035_484460034950769: undefined
https://graph.facebook.com/677811901/home?limit=3&access_token=AAACYjXGS5FQBAIR3brc2LibjBcZCi2kRJUybG8VMaaJSZARQ8SzNE7BE4PBrDIFVZB0AaVEa1dZCpX1fhCvoD2rnq8uc8OGaIFhO9uvVXAZDZD&until=1359178140
{
"limit": "3",
"access_token": "AAACYjXGS5FQBAIR3brc2LibjBcZCi2kRJUybG8VMaaJSZARQ8SzNE7BE4PBrDIFVZB0AaVEa1dZCpX1fhCvoD2rnq8uc8OGaIFhO9uvVXAZDZD",
"until": "1359178140"
}
655515199_403590309726450: a good resolution to take on Republic Day
505588854_496901583686790: Love the secret world that slow motion reveals.
693811975_10151217837201976: undefined

Exemple 3: Exécution: page1 -> page2 -> page 1 ou page -> next -> précédent Le code suivant va charger la page 1, puis cliquez sur "suivant" page (page2), puis revenir à la page 1, à l'aide de "précédent"

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" src="https://raw.github.com/cowboy/jquery-bbq/master/jquery.ba-bbq.min.js"></script>
<script>
var i =0;
var getPosts = function (response){
for (element in response.data){
post = response.data[element]
console.log(post.id + ": " +post.message);          
}
//can i call FB.api(nextPage, getPosts); ??
if(i < 2){
nextPage = response.paging.next;        
if(i==1)
nextPage = response.paging.previous;
console.log(nextPage);
i++;
$.get(nextPage, getPosts, "json"); //optional: $.getJSON can be use instead
}
}
$(document).ready(function(){
$('#loadPosts').bind('click', function() {
FB.api('/me/home',{since:'yesterday','limit': '3'}, getPosts);   
});
})
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
//init the FB JS SDK
FB.init({
appId      : 'XXXXXXXXXXXX', //FILL YOUR APP ID HERE!
status     : true, //check the login status upon init?
cookie     : true, //set sessions cookies to allow your server to access the session?
});
//Additional initialization code such as adding Event Listeners goes here
};
</script>
<button id="loadPosts">Load Posts</button>
<p>Please open developer console to see what's happening. In Firefox, you can use ctrl+shift+k, and in Chrome/Chromium use ctrl+shift+i</p>
</body>
</html>

Réponse:

PAGE1:
367116489976035_536806916340324: How big is the Solar System?
Full infographic here: http://bit.ly/WmzfVn
137723270230_10152423534790231: "Sociologist" Ashis Nandy has claimed that most of the corrupt came from OBC/SC/ST castes.
Following this, Corrupt people have strongly condemned Nandy's attempts to divide them on caste lines. They'll be united in loot, forever.
100004192352945_156620584487686: undefined
PAGE2:
https://graph.facebook.com/677811901/home?limit=3&access_token=AAACYjXGS5FQBAKqIMyCVYjH9upK4e2bjUwLoVbbFDL0ffc0SZBTVR9MUFGV4ZCq6HBdFIadFMpLDC3ATMZCJ4GPsXWpG4qTGODavuvzLAZDZD&until=1359185659
137723270230_10152423499430231: On this day, please spare a thought for those fellow citizens, for whom I just spare a thought and do nothing else.
642965867_10151211036740868: Thanks everyone for their wishes! The wishes made my day!
367116489976035_536776529676696: Rage. Quit. Life.
PAGE1:
https://graph.facebook.com/677811901/home?limit=3&access_token=AAACYjXGS5FQBAKqIMyCVYjH9upK4e2bjUwLoVbbFDL0ffc0SZBTVR9MUFGV4ZCq6HBdFIadFMpLDC3ATMZCJ4GPsXWpG4qTGODavuvzLAZDZD&since=1359185123&__previous=1
367116489976035_536806916340324: How big is the Solar System?
Full infographic here: http://bit.ly/WmzfVn
137723270230_10152423534790231: "Sociologist" Ashis Nandy has claimed that most of the corrupt came from OBC/SC/ST castes.
Following this, Corrupt people have strongly condemned Nandy's attempts to divide them on caste lines. They'll be united in loot, forever.
100004192352945_156620584487686: undefined

VIEILLE RÉPONSE

Utilisation limit, offset, since et until paramètres pour atteindre votre objectif.

Consulter: http://developers.facebook.com/docs/reference/api/

Pagination

Lors de l'interrogation des connexions, il y a plusieurs paramètres utiles qui vous permettent de filtrer et de la page de connexion de données:

limite, offset: https://graph.facebook.com/me/likes?limit=3

jusqu'à ce que, depuis (un timestamp unix ou à toute date acceptée par strtotime): https://graph.facebook.com/search?until=yesterday&q=orange

Suivantes devraient recevoir tous les postes depuis last week jusqu'à yesterday de 21st - 30th message (en gros, troisième page de 10 messages par page de la pagination).

 FB.api(
'/me/home',
{
'since':'last week',
'limit': '10',
'offset': '20',
'until': 'yesterday'
}, 
getPosts
);

Je viens de le tester, il fonctionne. J'ai utilisé limit=4, qui est la page de taille genre de chose. Donc, quand j'ai récupérer les données depuis Fév 02, 2011 (Unix horodatage: 1296626400) jusqu'à aujourd'hui, à l'aide de cette

https://graph.facebook.com/me/home?access_token=[AUTH_TOKEN]&since=1296626400&limit=4

Il renvoie les données, il fournit aussi des URL de retour pour aller à la page suivante

{
"data": [
<ARRAY OF POSTS HERE>
],
"paging": {
"previous": "https://graph.facebook.com/me/home?access_token=[NEW_AUTH_TOKEN]&since=1298026753&limit=4",
"next": "https://graph.facebook.com/me/home?access_token=[NEW_AUTH_TOKEN]&limit=4&until=1298023222"
}
}

Vous pouvez utiliser en toute sécurité previous et next attributs de l'objet JSON pour passer à la page suivante (ou la page précédente). Cela semble être la façon la plus simple de le faire.

Par la voie, \u00257C doit être converti à | pour obtenir que cela fonctionne.

Je pense que vous n'avez pas de réponse de l'affiche en question. Il dit: "Mais je suis un URL de la page précédente et je ne sais pas comment faire un javascript FB.les appels de l'api à partir de l'adresse URL".
qui le sait mieux que l'OP, qui l'a acceptée?
Que dire des gens qui arrivent ici à partir de Google avec la même question? Une réponse qui ne correspond pas à la question n'a pas de valeur à long terme.
Je suis arrivé ici à partir de google et cette réponse n'a pas répondu à ma question
Facebook vient d'une mise à jour, nous ne pouvons pas utiliser limit et offset plus, essayez de since et until au lieu
href="https://developers.facebook.com/docs/reference/api/pagination/" >developers.facebook.com/docs/reference/api/pagination montre trois types de pagination. J'ai validé que vous pouvez utiliser limit avec le curseur en fonction de la pagination. Aussi, le doc a dit qu'ils soutiennent offset trop. Je vais vérifier ça. Je n'espère pas qu'ils ont dépassées docs.
pls vérifier ce lien developers.facebook.com/roadmap/#february-2013

InformationsquelleAutor Nishant

Si vous voulais simplement obtenir la page suivante (en utilisant la pagination.à côté de l'objet), vous pourriez faire un jQuery.getJSON demande. Quelque chose comme ce qui suit:

function loadAlbums(){
FB.api('/me/albums', function(response){
handleAlbumsResponse(response);
});
}
function handleAlbumsResponse(response){
var albums = response.data;
for( var i in albums){
var album = albums[i];
$('#albums ul').append('<li><a href="#">' + album.name + '</a></li>');
}
if( response.paging.next){
console.log('fetching next page...');
$.getJSON(response.paging.next, function(response){                
handleAlbumsResponse(response);
});
} 
}

InformationsquelleAutor Craig Myles

3

La contrainte de clé dans votre question, nous ne pouvons pas utiliser le "prochain" de l'url fourni dans la réponse.

Je vais essayer de répondre à votre question en demandant d'abord à une question plus générale:

Comment pouvons-nous créer une expérience utilisateur de notre Facebook app où chaque appel pour plus d'articles retourne le même nombre d'éléments.

Si l'utilisateur demande des "plus" et obtient 10 points, les presses de "plus" et récupère puis 4, puis 7 etc, elle va penser que notre application est en buggy.

Sur l'Open Graph page d'intro, différents paramètres pour la pagination sont introduits. Ce sont:

limite

décalage

jusqu'à

depuis

comme mentionné dans le 'pagination' en-tête. Cependant, si nous mettons en œuvre une solution avec limit et offset où on incrémente le compteur de décalage ,par exemple:
```
https://graph.facebook.com/me/home?limit=10&offset=OFFSET
```
où OFFSET sera augmenté par la limite de chaque demande, nous constatons que le nombre de résultats retournés parfois de ne pas être égal à la “limite” de paramètre que nous avons spécifié. C'est parce que les paramètres sont appliqués sur Facebook côté avant de vérifier si l'interrogé les résultats sont visibles pour le spectateur. Nous demandons 10, mais il peut arriver, 8 éléments en retour.

Cela signifie que nous ne pouvons pas utiliser une solution où l'on incrémente limit et offset si nous voulons que notre application "plus" requête retourne toujours la même quantité d'objets.

Une solution proposée dans ce blog par Jeff Bowen (qui travaille sur le Facebook de platforme de l'équipe) est cette logique:
- demande d'élément avec limit = YOUR_LIMIT.
- récupérer le created_time champ du dernier élément de la réponse.
- demande de 10 éléments avec depuis = RETRIEVED_CREATED_TIME et limite=YOUR_LIMIT
Voici un exemple de code, basé sur un exemple dans le billet de blog mentionnés ci-dessus:
```
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);
}
}
}
```
Cette solution récupère les 10 éléments du fil d'actualité de l'utilisateur dans l'ordre chronologique, sans l'aide de l'url dans la réponse JSON.
- Je suis tombé sur ce post, après avoir créé un code similaire à l'aide de la même logique. Cependant, comme je l'ai appeler la fonction, le nombre de postes diminue (presque de moitié) jusqu'à ce qu'il atteigne zéro. Avez-vous vu ce genre de comportement?
- C'est curieux. Vous suggère de poster une nouvelle question avec votre code.
- A finalement obtenu la question posté.
InformationsquelleAutor Gunnar Karlsson

Il travaille

    function friends_list()
{
for (var x = 0; x<500; x++)
{
FB.api(
'/me/friendlists/',
'GET',
{"fields":"id","offset":x},
function(response) {
for (i = 0; i < response.data.length; i++) 
{ 
document.getElementById("friends_list").innerHTML =  
document.getElementById("friends_list").innerHTML + "<br>" + response.data[i].id; 
}
document.getElementById("friends_list").innerHTML =  
document.getElementById("friends_list").innerHTML + "<br>" ;
}
);
}
}

InformationsquelleAutor Googlian

0

J'ai remarqué que la question est très ancienne. Ma réponse est vrai pour ces jours FB jsSDK (2017) 🙂

En fait c'est plus simple que ce que les prédécesseurs décrit et peu intuitive. FB jsSDK c'est une API en elle-même, et il est prévu pour être en mesure de naviguer à travers les pages de la réponse par lui-même et en utilisant le même moyen, non?
```
function getPosts(){
FB.api('/me/posts', 'GET', {limit:250}, cbGetPosts);
}
function cbGetPosts(response){
//do your stuff with response.data
if(response && response.paging){
FB.api(response.paging.next, cbGetPosts); //yep, is this simple
}
}
```
Évidemment, cela demande pour les pages suivantes, tant qu'il y a une touche next défini, mais il s avère que le concept.
- désolé pour le nécro, mais vous avez aucune idée si il est un moyen possible de faire quelque chose de similaire. Je vais essayer d'aller à la deuxième page de mes données, il n'a jamais arives
InformationsquelleAutor bluehipy

Vous devez vous connecter pour publier un commentaire.