BigThink

Una Classe PHP per Applicazioni Facebook IFrame con Graph API

Oggi voglio farti un regalo che spero apprezzerai: ho deciso di condividere la Classe PHP che uso per sviluppare le mie Applicazioni Facebook.

Grazie ad essa potrai creare un’App in pochissimo tempo, perchè contiene già tutta la struttura necessaria per il login e le chiamate API.

La Classe utilizza le nuove Graph API ed è pensata per le Applicazioni IFrame, visto che pare che Facebook stia spingendo in quella direzione, rendendo deprecate quelle FBML.

Ma vediamo ora come installare e configurare il tutto.

1. Crea l’Applicazione

Questo è un passo che ho già spiegato decine di volte, ma lo ripeto nuovamente per completezza:

  • Vai alla pagina di creazione dell’applicazione.
  • Inserisci il nome e accetta le condizioni. Quindi procedi.
  • Vai sul tab “Web Site”.
  • Inserisci la “Site URL”, ovvero l’URL del dominio principale (es: http://www.miosito.it/).
  • Clicca sul tab “Facebook Integration”.
  • Inserisci la “Canvas Page”, che sarà l’indirizzo della tua App.
  • Inserisci la “Canvas URL”, ovvero l’URL della cartella sul tuo server (es: http://www.miosito.it/facebookapp/).
  • Assicurati che “Canvas Type” sia IFrame.
  • Imposta “Dimensione dell’IFrame” su “Auto-resize”.
  • Salva le modifiche.

2. Scarica la Classe

Scarica lo zip che contiene la Classe ed il resto dell’ambiente di sviluppo da me strutturato:

Facebook Graph API Class 1.2  Facebook Graph API Class 1.2 (11,5 KiB) - scaricato 3.823 volte

Scompatta lo zip e uploada i file sul tuo server.

3. Configura l’Applicazione

Il file config.php permette la configurazione di tutti i parametri necessari al funzionamento:

  • APP_ID: l’ID della tua Applicazione.
  • API_KEY: la “Chiave API”.
  • SECRET: il valore di “Applicazione nascosta”.
  • APP_NAME: il nome della tua App.
  • URL: l’indirizzo pubblico della tua applicazione (ovvero la “Canvas Page”).
  • MY_URL: l’indirizzo della cartella sul tuo server (la “Canvas URL”).

A questo punto non ti resta che uploadare il file config.php sul server ed andare sulla tua Applicazione!

4. Com’è strutturato l’ambiente

I file che troverai nello zip sono:

  • commons.php: questo file va incluso in ogni pagina della tua Applicazione. Si occupa di importare tutte le librerie e di instanziare l’oggetto Facebook.
  • config.php: abbiamo già visto che permette di configurare i parametri.
  • index.php: è la home della tua App. In questo caso fa delle chiamate per dimostrare il funzionamento della Classe.
  • header.php: è l’intestazione della pagina. Contiene l’instanziazione dell’oggetto Facebook lato client.
  • footer.php: il footer delle pagine. Puoi personalizzarlo come preferisci, ad esempio con i tuoi credits.
  • style.css: il foglio di stile.
  • lib/facebook.php: la più recente versione della nuova PHP SDK.
  • lib/FB.class.php: la mia classe, che ora vedremo nel dettaglio.

5. Come utilizzare la Classe

Basta guardare l’esempio per capire come utilizzarla, ma vediamo comunque insieme i metodi base.

Instanziare la Classe

La seguente riga di codice crea l’oggetto Facebook e gestisce da sola tutta la procedura di autenticazione. E’ possibile passare come parametro una stringa contenente i permessi che si desidera richiedere all’utente in fase di accesso all’Applicazione.

$fb = new FB('publish_stream,email');

Ottenere l’ID dell’utente

$uid = $fb->getUserId();

Ottenere informazioni sull’Utente

Se non si passa alcun parametro, verrà restituito un array con le info dell’utente corrente:

$info = $fb->getUserInfo();

Altrimenti possiamo richiedere le info su un utente specifico:

$friendInfo = $fb->getUserInfo(537461288);

Ottenere la lista degli amici

$friends = $fb->getFriends(4);

Se gli passimo un attributo, quello sarà il limite massimo di amici da restituire.

Verificare se un utente è Fan di una Pagina

if($fb->isFan('33933529842')){
    echo "Sei fan";
}

Aggiornare lo stato

Se inserisci solo il messaggio, verrà pubblicato sulla tua Bacheca:

$fb->updateStatus("Studio le Graph API");

Altrimenti puoi impostare l’ID dell’utente o Pagina su cui postare:

$fb->updateStatus("Studio le Graph API", 537461288);

Pubblicare un allegato in Bacheca

$fb->streamPublish("Una classe per Facebok",
                   "http://www.bigthink.it/classe-php-applicazioni-facebook-graph-api",
                   "Interessante!",
                   "http://www.bigthink.it/images/thumb.jpg");

Queste sono solo alcune delle funzionalità che Facebook mette a disposizione degli sviluppatori. Ovviamente puoi aggiungere ulteriori metodi, in base alle tue esigenze.

6. Un Fix per Internet Explorer

La mia prima Applicazione creata con questa Classe andava perfettamente se aperta con Firefox, ma con IE dava un sacco di problemi. Continuava a fare redirect assurdi tra una pagina e l’altra.

Cercando online ho poi scoperto che era un problema di Cookies: trovandosi all’interno di un IFrame, i Cookies di Facebook non venivano salvati, non permettendo così il salvataggio della Sessione.

La soluzione è molto semplice, basta inserire questa linea di codice in testa a tutte le Pagine della tua App:

header('P3P: CP="CAO PSA OUR"');

Se hai scaricato il mio ambiente di sviluppo, la trovi già inserita nel file commons.php, che va comunque incluso in tutte le pagine.

Per approfondimenti ti rimando a questi articoli, ai quali mi sono ispirato per la creazione della Classe:

UPDATE 22/9/2010

  • Ho aggiornato l’articolo, sistemando secondo la nuova interfaccia di creazione dell’Applicazione.
  • Ho aggiornato la classe alla versione 1.1, sistemando alcune piccole cose e sostituendo la vecchia SDK con la nuova versione.

UPDATE 27/11/2010

  • Aggiornato la classe alla versione 1.2: aggiunto parametro “next” e corretto un piccolo errore.

Articolo scritto da Ghido

Fondatore di BigThink.it, si occupa dello sviluppo e del coordinamento dei progetti tecnologici. Specializzato nel Marketing su Facebook e nello sviluppo di Applicazioni Social, fa consulenza e formazione ad aziende ed agenzie.

Leggi anche...

Come guadagnare con un'Applicazione Facebook

Come guadagnare con un’Applicazione Facebook

Abbiamo visto dove trovare hosting gratuito per iniziare a programmare la vostra Applicazione Facebook fino a quando non avrà successo. Vi ho insegnato come crearla, svilupparla e disegnarla. Ora è giunto il momento di scoprire come guadagnare con la vostra App! Ci sono diverse possibilità: le analizzeremo una ad una e vedremo quali sono i ...
Facebook obbliga gli Sviluppatori a comprare un Certificato SSL!

Facebook obbliga gli Sviluppatori a comprare un Certificato SSL!

Ieri Facebook ha fatto un annuncio non da poco per gli sviluppatori di Applicazioni Facebook: pare che da Ottobre qualsiasi Applicazione avrà bisogno di un certificato SSL per poter funzionare. Sai cosa significa questo? Che se sviluppi Applicazioni per hobby o per gioco, ad esempio, dovrai acquistare un certificato. E lo stesso se hai ...
Come creare un Tab avanzato sulla tua Pagina Facebook

Come creare un Tab avanzato sulla tua Pagina Facebook

Qualche tempo fa ti ho spiegato come creare un Landing Tab personalizzato, utilizzando l'applicazione Static FBML. Tramite essa è possibile creare un Tab con contenuti base come semplici immagini e testi. Ma se volessi creare un Tab con contenuti avanzati, dinamici, magari recuperati da database? La soluzione è presto detta: devi creare un'Applicazione Facebook ...
Facebook, i nuovi Tab IFRAME e la morte di FBML

Facebook, i nuovi Tab IFRAME e la morte di FBML

Con le nuove Pagine Facebook è arrivato anche un grande cambiamento che non può passare inosservato: i nuovi Tab IFRAME. Se prima i Tab potevano contenere solamente FBML e FBJS — con grandi limitazioni di funzionalità — ora invece i Tab supporteranno gli IFRAME, permettendo agli sviluppatori di fare e caricare praticamente qualsiasi cosa ...
6 Generatori di Applicazioni Facebook

6 Generatori di Applicazioni Facebook

Abbiamo parlato spesso di Applicazioni Facebook e vi ho illustrato numerose guide tecniche per sviluppare da zero un'Applicazione. Tuttavia, non siete certo tutti programmatori e potreste avere diverse difficoltà. Vi vengo incontro nuovamente: se avete sempre desiderato creare una vostra Applicazione Facebook, ma non ne avete le capacità, ecco finalmente quello che fa per ...

131 Commenti

  1. sancora

    Ciao, ottimo lavoro.
    Per caso in tutti questi mesi c’e’ una versione con piu’ funzioni? Per esempio mi interessava postare su pagine da fan. Come dovrei fare?
    Grazie

    10 ottobre 2011, 14:52
  2. Matteo

    Ricevo il seguente errore

    To fix this error, please set your Canvas Callback URL in the application settings editor. Once it has been set, users will be redirect to that URL instead of this page after logging in.

    Come faccio a dare una Canvas Callback?

    4 settembre 2011, 15:09
  3. beppe

    Ciao Ghido,
    grazie per questa preziosa guida,

    ti chiedo aiuto per un piccolo problema, testando la funzione “$fb->updateStatus(“Studio le Graph API”);” (aggiungendola al file index.php) capita che la bacheca dell’utente si riempie di post, cioè ne viene pubblicato uno ogni 4-5 secondi. Come posso risolvere? grazie

    ciao

    8 giugno 2011, 14:21
  4. Alberto

    Ciao! ho provato ad installare ieri l’applicazione di prova…..
    all’inizio tutto ok….

    Senza modificare nulla, ma solo cambiando il nome dell’applicazione e la cartella dove è salvata sul mio sito, accade questo:

    Prime due informazioni:
    Name: ora si vede “YOU” ( e quindi non il mio nome)
    Email: VUOTO

    sapresti dirmi il motivo?
    grazie.

    ulteriore domanda….se io volessi aggiungere anche la foto degli amici nella “stampa” dell’array….come potrei fare?

    27 maggio 2011, 14:32
  5. Ho utilizzato la tua classe per fare la mia applicazione. Serve per cercare i link postati su facebook http://apps.facebook.com/thelinkfinder cosa ne pensi?

    17 maggio 2011, 22:41
  6. Diego

    Salve ragazzi,

    ho configurato tutto con i miei dati della app, ma mi da qwesto errore :

    Parse error: syntax error, unexpected ‘{‘ in /membri/geistad/facebook/myapp/commons.php on line 9

    any ideas?

    9 maggio 2011, 17:31
  7. Daniele

    Capita anche a me la storia del refresh con le vecchie applicazione sviluppate con la versione 1.0. Adesso ho scaricato quella nuova, sostituito i file e configurato tutto perfettamente ma non va, anche cambiando togliendo gli / sia in URL che in MY_URL. Qualcuno ha trovato il modo di risolvere?

    30 aprile 2011, 22:42
    • Daniele

      Ho trovato il modo. Basta cambiare ed aggiungere un permesso che l’app deve richiedere e si risolve il problema!

      1 maggio 2011, 20:53
      • che permesso bisogna chiedere puoi postare il pezzo di codice da modificare?

        2 maggio 2011, 07:19
  8. Ciao, ho seguito le tue istruzioni e ho impostato il config.php con i miei dati, l’unico problema è che quando clicco sul pulsante del login mi fa uscire solo un icona di facebook e un indirizzo a facebook, ma niente di tutto ciò che sta nell’index.php, come mai?

    javier

    14 aprile 2011, 10:16
  9. spider

    Ciao Ghido,
    Vorrei chiederti un consiglio. Se volessi inserire un bottone per invitare gli amici, come devo procedere?
    (naturalmente non ti sto chiedendo tutto il codice, solo qualche indizio, cosa devo studiarmi) Grazie

    12 aprile 2011, 21:27
  10. per il problema con IE và bene anche così?

    13 marzo 2011, 19:20
  11. Roldano

    Ciao Daniele, sto provando la tua classe.
    Dopo la richiesta di autorizzazione succede che va in loop infinito senza mai caricare l’applicazione.
    Ho caricato il tuo esempio esattamente così com’è modificando solo config.php

    Succede con qualunque browser..
    Sai dirmi qualcosa in merito?
    Grazie per il tuo contributo.

    20 febbraio 2011, 21:31
    • Tutto a posto… questione di slash finali che mettevo in URL e MY_URL, e in più ho scaricato l’ultima versione facebook.php

      Ora va.
      Grazie

      21 febbraio 2011, 00:09
      • Occasionalmente vien fuori sto problema:

        Uncaught Exception: 190: Invalid OAuth 2.0 Access Token thrown in facebook.php on line 515

        sto usando la libreria più recente di facebook.

        Pare che l’errore si verifichi solo agli utenti che utilizzano più di un account FB sullo stesso PC.

        Capita a qualcuno di voi?

        22 febbraio 2011, 02:35
  12. Ciao Ghido,
    ho sviluppato diverse applicazioni, molto semplici ed ho da poco iniziato ad usare la classe seguendo i tuoi suggerimenti e quelli di thinkdiff.

    Non ho trovato all’interno della classe un metodo per l’invito degli amici. Non sarebbe male anche questa implementazione diretta.

    18 febbraio 2011, 09:44
  13. Andrea

    Anche io devo fare una tab. Solo che non è possibile utilizzare iframe in una tab. Come posso usare la classe per crearmi una tab?

    5 febbraio 2011, 18:37
  14. Mario

    Quali sono le pagine necessarie per agire tramite codice sulla app?

    3 febbraio 2011, 09:33
  15. Mario

    Ho seguito la tua guida per creare un applicazione.
    Sino ad ora ho ottenuto questa pagina qui
    http://apps.facebook.com/prova_effe/

    Il mio obiettivo è quello di creare una tab da inserire in un unico profilo per inserirci dentro un IFrame dato che con FBML non è possibile.

    Puoi dirmi se ho fatto tutto corretto?

    2 febbraio 2011, 12:50
  16. Ciao Ghido,
    Prima di tutto complimenti per la pazienza e la disponibilità..
    E grazie per il grande lavoro..
    Ti ringrazio perchè in questi mesi volevo provare a fare delle applicazioni su FB e per puro caso ho trovato il tuo materiale che mi ha aiutato molto riducendo tantissimo i tempi e rendendomi le idee più chiare sulle API di fb ^^
    Volevo chiederti una cosa, che però forse (o sicuramente) può dipendere da un mio problema..
    E’ un qualcosa di strano che accade durante il redirect solo sotto IE e non sotto Firefox o altri Browser..(e neanche su tutti gli IE)…Ho notato che, quando all’interno della mia applicazione ci sono della pagine php che attendono informazioni da un’altra pagina attravarso i metodi GET o POST, Internet Explorer in realtà mi ricarica la pagina in cui si trova mostrando uno strano url

    Sotto Firefox o Internet Explorer antecedenti alla versione 8, tutto questo non accade visto che i link funzionano alla perfezione (o meglio i bottoni) e i dati passati con GET e POST vengono passati senza alcun problema…
    Su alcuni invece, più precisamente solo SUI MIEI COMPUTER (xD) con Internet Explorer 8 invece mi capita questa stranezza..
    Ti faccio vedere gli url..

    Dopo che si clicca sul bottone, invece di caricare la pagina php che attente i dati, nel campo url compare questo:

    https://www.facebook.com/login.php?api_key=******&cancel_url=http%3A%2F%2F*******.altervista.org%2Ffacebookapp%2Fskill_amico.php%3Fid_amico%3D552157048&display=page&fbconnect=0&next=http%3A%2F%2F******.altervista.org%2Ffacebookapp%2F&return_session=1&session_version=3&v=1.0&canvas=1&req_perms=publish_stream%2Cemail

    Insomma, tenta di andare alla pagina login.php di facebook portando con se i dati relativi alla mia applicazione (api_key, canvas page e così via) e alla fine, invece di mostrarmi la pagina skill_amico.php (che aspetta in get un dato id_amico), mi riporta alla pagina principale dell’applicazione mostrandomi quest’altro url

    http://apps.facebook.com/********/?session=%7B%22session_key—etc.etc.etc.

    Ho provato sul fisso sul quale sto lavorando (con Seven e IE8) e mi succede questa cosa..
    Ho provato sul portatile (Sempre Seven + IE8) …uguale, stesso problema..
    Ho fatto partire Windows XP virtualizzato che ha IE 6 sul primo computer..e questo non accade..
    Ho fatto provare ad un amico (Seven+IE8) e a però lui non accade..

    Quale pensi sia la causa? E perchè anche su computer uguali non accade sempre?

    26 gennaio 2011, 03:18
    • Neanche il tempo di postare che ho trovato il problema…
      Solo sui computer a cui dava errore,Internet Explorer 8 rifiutava i cookie quando veniva caricata l’applicazione…Una volta che gli si dava invece l’autorizzazione, tutto questo non accadeva più..
      Il mistero che dovrò risolvere ora è capire il perchè ^^’

      26 gennaio 2011, 03:32
  17. serri

    Ciao,
    grazie e complimenti per l’articolo, prima di tutto!
    Volevo farti una domanda, forse molto banale,
    ma come si trattano i caratteri speciali (tipo \n %80 %20)
    nella funzione $fb->streamPublish ?

    22 gennaio 2011, 16:18
  18. “The user hasn’t authorized the application to perform this action” secondo me vuol dire che l’utente che stà cercando di scrivere non ha il permesso di farlo.
    Sei sicuro di aver configurato bene l’app ??

    21 gennaio 2011, 20:33
  19. luca

    Ciao Ghido!
    Ottima “guida” per chi inizia, davvero!

    Ma io ho dei dubbi, magari tu ne sai più di me (sicuramente sì!)

    Insomma, io ho creato la mia applicazione, aprendo al volo uno spazio web su altervista (niente di che, era solo per provare), e avrei bisogno che questa applicazione fosse in grado di:
    – caricare una foto di un gruppo

    Prima di arrivare a questo, ovviamente ho provato a postare un link qualsiasi sulla bacheca dell’utente collegato, con il la tua funzione:

    $fb->streamPublish(“Gud sample”,
    “http://www.youtbe.com”,
    “Xe ben”,
    “http://www.michelepapaleo.it/wp-content/uploads/foglia_di_ciliegio.jpg”, ID_USER);

    Il problema è che il codice mi restituisce l’errore:

    Fatal error: Uncaught OAuthException: (#200) The user hasn’t authorized the application to perform this action
    thrown in …./facebook.php on line 543

    )):

    21 gennaio 2011, 17:38
  20. Ciao,
    scusa se ti disturbo, ma non capisco dove sbaglio.
    Ho caricato su la tua classe e messo su i dati in config.php,
    ma quando lancio l’app mi da questo errore:

    Parse error: syntax error, unexpected ‘{‘ in /membri/paolorape/facebook/src/commons.php on line 9

    Sono andato a quella riga (include_once(“lib/facebook.php”); )
    ed ho provato a togliere il try/catch, ma a questo punto mi dice:

    Parse error: syntax error, unexpected T_STRING, expecting T_OLD_FUNCTION or T_FUNCTION or T_VAR or ‘}’ in /membri/paolorape/facebook/src/lib/FB.class.php on line 38

    20 gennaio 2011, 12:20
    • [ RISOLTO ]

      __construct() è stato introdotto in php5, sul server era impostato php4.

      Spero sia di aiuto..

      20 gennaio 2011, 12:29
  21. rocco

    ciao

    sto tentando di fare un’applicazione che carichi automaticamente le foto sul profilo dell’utente che accetta l’app..

    uso questo codice ma non ottengo nessun risultato:

    //mi recupero id dell’album
    $albums = $fb->api(‘/me/albums’);
    foreach ($albums[‘data’] as $album) {
    if($album[‘name’] == ‘Profile Pictures’){
    $album_uid = $album[‘id’];
    }
    }

    $photo_details = array(
    ‘message’=> ‘Photo message’
    );
    //indico il percorso di dove si trova la foto
    $photo_details[‘image’] =’http://********/***/testing/pubblica/06032010024.jpg’;
    $upload_photo = $fb->api(‘/’.$album_uid.’/photos’, ‘post’, $photo_details);

    Non va in errore ma non ottengo nulla

    una mano

    12 gennaio 2011, 12:39
    • Spider

      Io invece dovrei passare il vero url della foto ad una applicazione, ma non ci riesco.

      Questo è il codice che uso:

      $usersArray = $this->facebook->api(“http://graph.facebook.com/me/picture?access_token=” . $access_token);

      Per stamparla nessun problema
      <img src= />

      Il problema è che $usersArray contiene ancora “http://graph.facebook…..” e non il vero url della foto. Come faccio ad ottenerlo?

      12 gennaio 2011, 14:07

1 Citazioni