Facebook connect avec Graph API et PHP
Facebook connect est une solution qui permet à n’importe quel site web de proposer à ses visiteurs de s’identifier rapidement via leur compte Facebook, c’est un moyen simple et rapide d’augmenter considérablement le nombre d’inscrits sur un site.
Le F8 à été l’occasion pour Facebook de présenter sa nouvelle API GRAPH, plus accessible et puissante, elle utilise une architecture basée sur un modèle RESTful, le format d’échange JSON et l’authentification est basé sur OAuth 2.0.
Voici comment mettre en place un Facebook connect sur votre site internet en utilisant la nouvelle API.
Comme toute application Facebook, il faut dans un premier temps l’enregistrer pour obtenir un identifiant et une clé secrète.
1. Configuration
Soit sur http://developers.facebook.com/setup/ ou sur le tableau de bord de vos applications : http://www.facebook.com/developers/apps.php
Cette opération va générer une Clé API (Application ID) et une Clé secrète qui comme son nom l’indique doit rester confidentielle.
Dans cet exemple je vais laisser tous les paramètres par défaut, vous n’aurez pas besoin de les modifier dans la plupart des cas pour l’intégration de Facebook Connect sur un site web.
Veuillez quand même vous assurez dans l’onglet « Connexion » que « URL connect » est valide, en effet c’est l’url où seront redirigés les utilisateurs une fois authentifiés. Vous pouvez aussi ajouter votre logo et si vous utilisez des sous domaines il faut spécifier le « Domaine de base ».
2. Mise en place du SDK PHP.
Vous pouvez récupérer le SDK PHP à cette adresse :
http://github.com/facebook/php-sdk
Seul le fichier facebook.php qui se trouve dans le répertoire src/ va être utile, il contient la classe qui permet de communiquer avec la plateforme Facebook.
Attention, cette classe utilise l’extension Curl de PHP pour se connecter aux serveurs Facebook, vérifiez que Curl est activé sur votre serveur avec un phpinfo().
Déplacer le fichier facebook.php de façon à ce qu’il puisse est inclus par votre site web.
3. Utilisation de l’API
Dans votre page de login ou dans une page de teste, il faut d’abords inclure et instancier la classe Facebook avec vos paramètres :
<?php
require 'facebook.php'; //Facebook class
define('FACEBOOK_APP_ID', 'xxxxx'); //remplacer xxxxx par le votre
define('FACEBOOK_SECRET', 'xxxxx'); //remplacer xxxxx par le votre
// Create our Application instance.
$facebook = new Facebook(array(
'appId'Â => FACEBOOK_APP_ID,
'secret' => FACEBOOK_SECRET,
'cookie' => true
));
?>
Ensuite il faut tester si l’utilisateur est déjà authentifier et si il l’est, récupérer ses informations :
<?php
$session = $facebook->getSession();
$me = null;
// Session based API call.
if ($session) {
try {
$uid = $facebook->getUser();
$me = $facebook->api('/me');
} catch (FacebookApiException $e) {
error_log($e);
}
}
?>
Côté template html il faut déclarer l’espace de nom Facebook de façon à pouvoir utiliser ses balises :
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
En suite, dans le body on inclus le js qui ouvre la popup d’identification et on affiche le bouton de connexion ou déconnexion :
<?php if ($me): ?>
<a href="<?php echo $facebook->getLogoutUrl(); ?>">
<img src="http://static.ak.fbcdn.net/rsrc.php/z2Y31/hash/cxrz4k7j.gif">
</a>
<?php else: ?>
<fb:login-button ></fb:login-button>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({appId: '<?= FACEBOOK_APP_ID ?>',
status: true,
cookie: true,
xfbml: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
</script>
<?php endif; ?>
On trouve aussi une notion de permissions dans le <fb:login-button >, par défaut on récupère le nom, prénom, id, ville, timezone, photo du profile, liste des amis, statut etc… mais certaines informations nécessitent des permissions supplémentaires comme l’email, les statuts, actualités, les appartenances aux groupes et pages etc…
Pour demander des autorisations supplémentaires il faut ajouter des paramètres au <fb:login-button > :
<fb:login-button perms= "email, user_birthday, user_status, user_location, user_relationships, user_website, read_stream, user_hometown, user_likes, user_photos" size="medium" background="light" length="long"></fb:login-button>
Pour connaitre le détail des permissions et les informations auxquelles vous aurez accès :
http://developers.facebook.com/docs/authentication/permissions
http://developers.facebook.com/docs/reference/api/user
Une fois l’utilisateur authentifié, une session est créer et la page de votre site est rechargée. Pour savoir de quelles informations vous disposez :
<?php if ($me): ?> <h3>Session</h3> <pre><?php print_r($session); ?></pre> <h3>You</h3> <img src="https://graph.facebook.com/<?php echo $uid; ?>/picture"> <?php echo $me['name']; ?> <h3>Your User Object</h3> <pre><?php print_r($me); ?></pre> <?php else: ?> <strong><em>You are not Connected.</em></strong> <?php endif; ?>
Plus haut vous aurez remarqué l’appel à la méthode api() : $me = $facebook->api(‘/me’);
C’est elle qui permet de faire des requêtes à l’api Facebook, attention vous obtiendrez un message d’erreur si vous demandez des informations auxquelles vous n’avez pas la permission.
Voici quelques exemples de requêtes :
$param =  array(
'method'Â => 'users.getinfo',
'uids'Â Â Â Â Â Â => $me['id'],
'fields'Â Â Â Â => 'name,current_location,profile_url,sex',
'callback'Â => ''
);
$userInfo  =  $facebook->api($param);
print_r($userInfo);
//require user_status permission
$status = $facebook->api('/me/statuses?limit=1');
echo $status['data'][0]['message'];
//require user_likes permission
$likes = $facebook->api('/me/likes');
print_r($likes);
echo "<p>Friends:</p>";
$friends = $facebook->api('/me/friends');
print_r($friends);
Voici le code complet de la page
et voici quelques liens facebook dont vous pourrez avoir besoin :
http://developers.facebook.com/docs/reference/api/user
http://developers.facebook.com/docs/authentication/permissions
http://developers.facebook.com/docs/guides/web
http://www.facebook.com/developers/apps.php
8 commentaires sur "Facebook connect avec Graph API et PHP"
Bonjour,
Facebook ne reconnait pas la balise FBML
Il me renvoit cette erreur:
Erreurs pendant le chargement de la page de l’application
Erreurs d’exécution :
FBML Error (line 3): unknown tag « fb:login-button »
Veuillez réessayer plus tard. Nous vous prions de patienter pendant que les développeurs de klzappliweb et Facebook résolvent le problème. Merci.
J’ai copié / collé exactement le code complet de la page, et je n’ai pas de cookies ni de variable de session après le rafraîchissement de la page….
Des suggestions?
[...] j’ai pu trouver un tutoriel (en francais en plus) et un script exemple. Grand merci donc à Propagg.com qui m’a permis d’avancer [...]
Merci pour ce tutorial !! Il m’a beaucoup aidé et c’est le premier que je trouve en français !
Pour infos si echo $me['name'] affiche rien et ou que la session facebook vous donne « You are not Connected. » dans l’exemple si dessus il faut ajouter cette ligne » curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); » dans le fichier facebook.php ligne 508 dans la fonction makeRequest de la class. j’ai passé plus de 6 heures à cherché pourquoi ca ne fonctionné pas ….
L’erreur php si on commente le try $me = $facebook->api(‘/me’) :
Fatal error: Uncaught CurlException: 77: error setting certificate verify locations: CAfile: /etc/ssl/certs/ca-certificates.crt CApath: none thrown in /var/www/vhosts/natura-game.fr/httpdocs/facebook/facebook.php on line 512
@++
Hello les gens,
Ce tuto est tres bon mais attention, il ne fonctionne qu’avec des applis au format Frame, et pas au format FBML.
Cela explique les problemes que vous avez :
- illegal tag « body » under « fb:canvas » ou « »
- unknown tag « fb:login-button »
- erreurs sur session
Allez dans Modifier les parametres > canevas > methode de rendu > selectionner Frame
Par contre, j’aimerais bien trouver un tuto qui fonctionne pour le FDML moi
A+