HOWTO: Utilizzare le API di Facebook nel vostro sito web – un esempio pratico

Volendo facilitare la vita a coloro i quali volessero firmare la nuova versione del Guestbook, ho pensato di provare ad inserire un metodo per compilare automaticamente tutti i campi del nuovo Guestbook (tranne quello dove scrivere il commento vero e proprio 🙂 ) tramite il log-in col proprio account di Facebook (che io però non utilizzo, ndr).

Prima di tutto bisogna registrarsi per ottenere una chiave API di Facebook all’indirizzo developers.facebook.com. Bisogna creare una nuova applicazione Web, darle un nome, ed inserire l’indirizzo del proprio sito nei campi “App Domains” e “Website with Facebook Login”.

Poi scaricate l’SDK per comunicare con Facebook via PHP da github a questo indirizzo, e caricatelo sul server FTP.

Create un nuovo file PHP e copiate al suo interno questo codice che ho scritto, per loggarsi tramite Facebook:

<?
//Facebook SDK and PHP, a pratical example for parsing Name,email,web address and avatar of an user. Code by flapane.com
require "facebook/facebook.php";
$facebook = new Facebook(array(
    'appId'  => YOURAPPID,
    'secret' => YOURSECRETID,
));

$user = $facebook->getUser();

if ($user) {
  try {
    $user_profile = $facebook->api('/me');

      $fbname = $user_profile['name'];
      $fblink = $user_profile['link'];
      $fbmail = $user_profile['email'];
      $fbid = $user_profile['id']; //per l'avatar utente
  } catch (FacebookApiException $e) {
    // The access token we have is not valid
    $user = null;
  }
}

if ($user) {
      $logoutUrl = $facebook->getLogoutUrl();
      $access_token = $facebook->getAccessToken();
      $logout_landing_page = "http://www.yourwebsite.com/index.php";
      $logout_url = "https://www.facebook.com/logout.php?access_token=".$access_token."&confirm=1&next=".$logout_landing_page;
    } else {
      $loginUrl = $facebook->getLoginUrl();
    }
?>
<?php 
if (!$user): ?>
   <div id="fb-root" style="display:none"></div>
    <script language="javascript" type="text/javascript"> //modifica per validazione w3c
//<![CDATA[
document.write('<fb:login-button size="medium" scope="email">Login with/Accedi con Facebook</fb:login-button>');
//]]>
    </script>
<?php endif ?>
    <script type="text/javascript">
      window.fbAsyncInit = function() {
        FB.init({
          appId      : '<?php echo $facebook->getAppID() ?>',
          status     : true, 
          cookie     : true,
          xfbml      : true,
          oauth      : true,
        });

        FB.Event.subscribe('auth.login', function(response) {
          window.location.reload();
        });
      };

      (function(d){
         var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
         js = d.createElement('script'); js.id = id; js.async = true;
         js.src = "//connect.facebook.net/en_US/all.js";
         d.getElementsByTagName('head')[0].appendChild(js);
       }(document));
    </script>
<? if ($user) {
echo "<img src='http://graph.facebook.com/$fbid/picture' title='Sei loggato come/Logged in as $fbname' alt='Sei loggato come/Logged in as $fbname' /><br /><a href='$logout_url'><img src='facebook/facebook-logout-button.png' title='Logout' /></a>"; //mostra avatar utente e logout button
}
?>

Sostituite a YOURAPPID e YOURSECRETID le chiavi che avete ottenuto da Facebook for Developers, salvate e caricate la pagina PHP appena creata.

Aprendola, vi verrà chiesto di effettuare il login tramite Facebook (ed apparirà il pop-up che elencherà le autorizzazioni richieste). Effettuato il log-in, sarete in possesso dei dati dell’utente (oltre che dell’avatar, che apparirà direttamente nella pagina, una volta effettuato il log-in).

I dati (nome, sito web, email ed avatar) sono contenuti nelle variabili:

$fbname = $user_profile[‘name’];
$fblink = $user_profile[‘link’];
$fbmail = $user_profile[‘email’];
$fbid = $user_profile[‘id’]; //per l’avatar utente

A quel punto, potrete utilizzarli come meglio volete (per esempio, per compilare automaticamente i campi del Guestbook).

E voi utilizzate Facebook o altri social network per facilitare l’accesso al vostro sito? Che metodo avete utilizzato?