J’ai récemment commencé à utiliser le framework Javascript SDK Facebook, qui assure une couche Javascript d’authentification et d’utilisation de l’API Facebook. Mon but à terme est de porter l’application que je développe, actuellement sous forme canvas/fbml/fbjs sous forme d’iframe/javascript sdk.
Alors, à base de jquery pour quelques appels Ajax, avec un soupçon de symfony sans ORM (mais pas réellement nécessaire sur le coup, limite j’ai perdu du temps à le mettre en place tout bien vu qu’il n’y a qu’une page), j’ai designé une page que je qualifierai de console de test Facebook, disponible sur http://fb.mkz.me/ et également sur http://apps.facebook.com/monkeyzfb/ dans sa version iframe. La console permet de tester certains appels issus de FB.api (graph et old rest), quelques appels FB.ui et quelques socials plugins.
Le code, quant à lui est très simple. Tout commence par quelques éléments html, un petit script javascript utilisant jquery, deux appels ajax, l’un pour changer le code et l’autre pour executer la commande FQL désirée.
Et hop, ça donne ça:
On notera les deux petits tricks suivants:
Pour savoir si la session facebook a été déconnectée, 3 lignes de codes suffisent. Au besoin, on pourra changer le document.location pour délogguer l’utilisateur de notre application:
if (response.session) {
FB.api('/me', function(response) { $('span#_status').text('Logged in as ' + response.name);});
} else {
$('span#_status').text('No session');
}
});
Et encore l’appel à FB.XFBML.parse() pour reparser manuellement toute la page après l’inclusion de nouveaux éléments xfbml (fb:comments, fb:profile-pic):
// On modifie une section cachée (_code) avec le code ecrit dans le textarea
$('span#_code').html($('textarea#_editor').val());
// On vide le result car le script va ecrire dedans
$('span#_result').html('');
// On parse le xfbml pour le voir s'afficher:
FB.XFBML.parse();
});