
Questa è la terza parte della guida alla creazione di un’applicazione Facebook di ComputerGeek.
Come ho già detto nel primo articolo, sto imparando anch’io ancora adesso come creare delle applicazioni Facebook ed ho pensato di rendere noto anche ai lettori di questo blog questo mio viaggio.
Prima di continuare voglio dirti che per comprendere pienamente questa parte della guida devi assolutamente leggere (se non l’hai già fatto) le precedenti due lezioni che puoi raggiungere da qui:
Creiamo insieme la nostra prima applicazione Facebook – Primi Passi
Creiamo insieme la nostra prima applicazione Facebook – Impostiamo Tutte Le Opzioni
Te le consiglio perché da adesso in poi gli articoli riguardanti le applicazioni Facebook saranno quasi ed esclusivamente riguardanti il codice (opportunamente spiegato e commentato).
Passiamo subito alla parte applicativa quindi, se tutto è andato nel verso giusto adesso hai creato una struttura delle cartelle ottimale per lo sviluppo della tua applicazione ed hai creato, dato un nome ed impostato correttamente tutti i parametri imposti da Facebook alla tua prima applicazione.
Adesso non ti resta che sapere come dar vita alla tua idea e la cosa migliore da fare, è un esempio. Ti mostrerò come ho costruito e sviluppato io la mia prima Facebook App spiegandoti tutto il codice in modo tale da poterlo gestire a tuo piacimento senza aver bisogno di essere un esperto.
Il codice che ti mostrerò è stato ripulito in modo tale da ottenere un codice più scorrevole e con più parametrizzazioni possibili.
Il programma che andremo a sviluppare, mostrerà in un App di Facebook gli ultimi articoli inseriti in ComputerGeek.it con la possibilità di invitare i propri amici ad utilizzare l’applicazione. Ovviamente capito il meccanismo, puoi creare qualsiasi cosa tu voglia una volta capito come utilizzare le API messe a disposizione da Facebook.
Il file “config.inc.php”
In questo file andremo ad inserire tutte quelle istruzioni che sono universali nella nostra applicazione e che quindi possono essere ripetute più volte nei vari file che la compongono. Inserendole tutte in “config.inc.php” possiamo semplicemente richiamare quel file senza doverle ogni volta ripetere. Il codice è spiegato attraverso i commenti:
<?php // INCLUDO LE LIBRERIE CHE CI SERVONO PER L'APPLICAZIONE: SIMPLEPIE PER IL PARSING DEL FEEDRSS e // FACEBOOK.PHP CHE RAPPRESENTA LA FACEBOOK PHP CLIENT LIBRARY require($_SERVER['DOCUMENT_ROOT']."/facebook_app/ComputerGeek_XYZ/include/simplepie.inc.php"); require($_SERVER['DOCUMENT_ROOT']."/facebook_app/ComputerGeek_XYZ/client/facebook.php"); // FACEBOOK API KEYS. SONO LE CHIAVI CHE TI VENGONO ASSEGNATE OGNI QUAL VOLTA CREI UN'APPLICAZIONE FACEBOOK. $api_key = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"; $secret = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"; // VIENE CREATO UN OGGETTO FACEBOOK $facebook = new Facebook($api_key, $secret); // DETTAGLI APPLICAZIONE. SONO IL NOME, LA CANVAS PAGE URL E LA CANVAS CALLBACK URL $appName = "ComputerGeek Feed"; $appUrl = "http://apps.facebook.com/computergeek_feed/"; $appcallbackurl = "http://computergeek.it/facebook_app/ComputerGeek_XYZ/"; // URL RSS DEL MIO BLOG (ISCRIVITI! :-) $rssUrl = "http://computergeek.it/feed/rss/"; ?>
Il file “index.php”
Questa sarà la home page della nostra applicazione, la pagina in cui tutti coloro che decideranno di utilizzarla approderanno per primi. Vediamo quindi cosa ho scritto io nel mio caso, nella speranza che possa esserti d’aiuto nello sviluppo di una tua applicazione personale:
<?php // RICHIAMA IL FILE CONFIG.INC.PHP require("config/config.inc.php"); // CHIEDIAMO ALL'UTENTE DI FAR COMPARIRE L'APPLICAZIONE ALL'INTERNO DEL SUO PROFILO $is_tab = isset($_POST['fb_sig_in_profile_tab']); if(!$is_tab) $user = $facebook->require_login(); ?> <?php // RICHIAMO GLI STILI DA APPLICARE ALLA NOSTRA APPLICAZIONE echo '<style type="text/css">'; require("include/style.css"); echo '</style>'; // CARICHIAMO IL FEED RSS CON IL PARSING TRAMITE SIMPLEPIE $feed = new SimplePie($rssUrl); $feed-> set_cache_location('cache'); $feed-> init(); $feed -> handle_content_type(); ?> <!-- FB:HEADER E' UNA ISTRUZIONE FBML DI CUI TI HO PARLATO --> <fb:header> Articoli ComputerGeek.it </fb:header> <!-- QUI HO INSERITO IL LINK CHE PORTA ALLA PAGINA PER INVITARE I TUOI AMICI AD UTILIZZARE L'APPLICAZIONE --> <a href="include/invitaAmici.php"> Invita i tuoi amici ad usare l'applicazione </a> <!-- QUI VIENE EFFETTUATO IL PARSING FORNITO DA SIMPLEPIE PER CIASCUN ARTICOLO PRESO DAL FEED RSS DEL MIO BLOG --> <?php echo '<ul>'; foreach ($feed -> get_items() as $item) { echo '<div>'; echo '<li><a target="_blank" href="'.$item -> get_permalink(). '">' . $item -> get_title() . '</a></li>'; echo '</div>'; } echo '</ul>'; ?>
P.S. Puoi vedere tutte le istruzioni FBML messe a disposizione da Facebook a questo indirizzo:
http://developers.facebook.com/docs/reference/fbml/
Il file “invitaAmici.php”
Puoi creare ed inserire questo file all’interno della cartella “include”.
Con questo codice sarai in grado di inserire una funzione importantissima all’interno del tuo programma, quella di poter invitare gli amici ad utilizzare l’applicazione. Altrimenti che applicazione sociale è? :-)
Questo codice è funzionante, ma ti assicuro che all’inizio ho avuto un po’ di grattacapi.
Comunque se hai qualche problema con questo o gli altri codici non esitare ad inserire un commento e sicuramente riceverai una risposta.
<?php require("../config/config.inc.php"); // RICHIEDO l'IFRAME IN CUI VERRA' VISUALIZZATA LA PAGINA PER IL MODULO DI INVITO $facebook->require_frame(); $user = $facebook->require_login(); // CON QUESTO IF VIENE FATTA UNA SELEZIONE TRA GLI INVITI GIA' MANDATI E QUELLI ANCORA DA MANDARE. // SE E' IMPOSTATA LA VARIABILE IDS VUOL DIRE CHE I NOSTRI INVITI SONO STATI MANDATI, ALTRIMENTI VIENE MOSTRATA LA LISTA DI // AMICI A CUI MANDARE ANCORA L'INVITO if(isset($_POST["ids"])) { echo "<center>Grazie per aver invitato ".sizeof($_POST["ids"])." dei tuoi amici ad usare <b><a href=\"http://apps.facebook.com/computergeek_feed/\">".$appName."</a></b>.<br><br>\n"; echo "<h2><a href=\"http://apps.facebook.com/computergeek_feed/\">Clicca qui per tornare a ".$appName."</a>.</h2></center>"; } else { // VIENE FATTA UNA RICHIESTA AL DATABASE DI FACEBOOK (TRAMITE IL LINGUAGGIO FQL, MOLTO SIMILE ALL'SQL) // RECUPERANDO GLI UTENTI CHE GIA' SONO ISCRITTI ALL'APPLICAZIONE $fql = 'SELECT uid FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1='.$user.') AND is_app_user = 1'; $_friends = $facebook->api_client->fql_query($fql); // ESTRAE GLI USERID E LI INSERISCE IN UNA LISTA (ARRAY) $friends = array(); if (is_array($_friends) && count($_friends)) { foreach ($_friends as $friend) { $friends[] = $friend['uid']; } } // CONVERTE LA LISTA DEGLI ID UTENTE IN UNA STRINGA $friends = implode(',', $friends); // TESTO CHE VERRA' VISUALIZZATO ALL'AMICO CHE VIENE INVITATO $content = "<fb:name uid=\"".$user."\" firstnameonly=\"true\" shownetwork=\"false\"/> sta usando l'applicazione <a href=\"{$appUrl}/\">".$appName."</a> e pensa possa esserti utile!\n". "<fb:req-choice url=\"".$appUrl."\" label=\"Aggiungi ".$appName." al tuo profilo\"/>"; ?> <!-- QUESTA E' LA CREAZIONE DEL MODULO DI INVITO VERO E PROPRIO FATTA COL COMANDO FBML FB:REQUEST-FORM E FB:MULTI-FRIEND-SELECTOR IN ACTION: LA PAGINA DA VISUALIZZARE DOPO AVER ACCETTATO L'INVITO (OPPURE QUANDO CHI INVITA CLICCA SU 'SALTA' IN TYPE: IL NOME DELLA VOSTRA APPLICAZIONE IN ACTIONTEXT: IL MESSAGGIO CHE DEVE APPARIRE IN ALTO A CHI INVITA --> <fb:request-form action="<?php echo $appUrl; ?>" method="post" type="<?php echo $appName; ?>" content="<?php echo htmlentities($content); ?>"> <fb:multi-friend-selector actiontext="Ecco l'elenco dei tuoi amici che ancora non usano <?php echo $appName; ?>. Invitali, è gratis!" exclude_ids="<?php echo $friends; ?>" /> </fb:request-form> <?php } // Fine if ?>
Con quest’ultimo file abbiamo terminato. Questa è un’applicazione decisamente completa e pronta per essere utilizzata da te e tutti i tuoi amici. Ovviamente non mi sono soffermato sugli stili e su altri codici che non riguardano propriamente la programmazione in Facebook, dato che sarebbe stato troppo lungo farlo.
Come ti ho già detto comunque, non dimenticarti di lasciare un commento se hai provato a sviluppare un’applicazione di questo tipo e per qualsiasi problema che hai riscontrato nello sviluppo.
P.S. Mi farebbe piacere se anche tu utilizzassi l’applicazione ComputerGeek Feed su Facebook invitando gli amici a cui credi possa interessare.
L’indirizzo per raggiungerla (anche se credo ormai l’avrai capito) è:
http://apps.facebook.com/computergeek_feed/
Grazie davvero per la collaborazione.




Visualizza il Feed RSS del tuo blog su Facebook creando un’applicazione ed invita i tuoi amici ad usarla…
Questa è la terza parte della guida alla creazione di un’applicazione Facebook di ComputerGeek. Come ho già detto nel primo articolo, sto imparando anch’io ancora adesso come creare delle appl……
Visualizza il Feed RSS del tuo blog su Facebook creando un’applicazione ed invita i tuoi amici ad usarla…
Questa è la terza parte della guida alla creazione di un’applicazione Facebook di ComputerGeek. Come ho già detto nel primo articolo, sto imparando anch’io ancora adesso come creare delle applicazioni Facebook ed ho pensato di rendere noto anche ai let…
ciao! ho letto tutta la guida, molto bella! ;) anche perchè non c’è moltissimo per il web se si vuole sviluppare app per facebook e in italiano… a me interessava particolarmente l’ultimo script, ma da quello che ho letto se ho attivato l’iframe non va.. il problema è che se attivo l’fbml mi da alcuni errori come:
CSS Error: Error in parsing value for property.: ‘width’ Declaration dropped.
HTML error while rendering tag “img”: Relative URLs not allowed here.
quindi non so bene come fare…