0251 / 590 837 15

Facebook Anwendung mit PHP (Tutorial)

Facebook ist mit über 400 Millionen Benutzern die wohl größte Community der Welt. Mit eigenen Facebook-Anwendungen kann man dort einiges reißen. Ich möchte euch heute ein Tutorial bietet, was nach und nach das Erstellen einer eigenen Anwendung erklärt.

UPDATE 22.11.2010: Die Facebook-API hat sich geändert und der in diesem Artikel vorgestellte Code funktioniert nicht mehr – Zum neuen Tutorial

Was in diesem Tutorial erstellt werden soll ist relativ simpel: Ein Notizblock. Man kann Sachen speichern und später wieder abrufen.

Registrierung

Als erstes ist natürlich ein Facebook Account erforderlich. Außerdem muss ein Developer-Account aufgesetzt sein. Dafür besucht ihr developers.facebook.com und klickt auf ‚Anwendung für deine Seite erstellen‘. Dort gelangt ihr zum folgenden Formular:

Basisangaben

Basisangaben

Hier gebt ihr den Namen, die Url und die Sprache eurer Seite an. Eine kleine Empfehlung von mir: Legt eine extra Subdomain für die Url an. Ich hatte später ein paar Probleme mit der Hauptdomain, da ich Mod Rewrite verwende. Habt ihr alles eingetragenbekommt ihr folgendes zu sehen:

API Authentifizierung

API Authentifizierung

Das kennt ihr zum Beispiel von den Google Webmaster Tools. Ihr ladet die Datei auf eurer Seite hoch und authentifiziert euch als Webmaster der Seite. Dann habt ihr es auch schon geschafft, denn nun bekommt ihr eure Keys:

Facebook API Keys

Facebook API Keys

Anwendung erstellen

Um nun eine Anwendung zu erstellen müsst ihr auf https://developers.facebook.com/ gehen und evtl. Zugriff gewähren. Wenn eure Anwendung dort noch nicht aufgelistet ist, klickt ihr auf ‚Neue Anwendung erstellen‘ andernfalls auf den Namen der Anwendung.

Facebook Developers

Facebook Developers

Ihr gelangt dann zur Übersicht eurer Anwendung. Dort steht ganz unten der Link ‚Kundenbibliothek herunterladen‘. Da klickt ihr drauf und speichert die Daten des Ordners /facebook-plattform/phpauf eurem Webspace. Danach klickt ihr weiter oben auf Einstellungen Bearbeiten. Hier gebt ihr alle Angaben zur Seite ein. Wichtig ist, dass ihr den Reiter ‚Leinwand‘ ausfüllt. Nach einem Fehler dort musste ich lange suchen! Gebt dort bei ‚Url der Leinwandseite‘ den Namen eurer Anwendung ein. Die Canvas Callback Url muss zum Verzeichnis der Facebook-Dateien führen. Wichtig: Am Ende ein ‚/‘.

Eure Anwendung könnt ihr später über die Url der Leinwandseite aufrufen.

Initialisierung

Erstellt die Datei index.php. Darin kommt der nun folgende Code.

Als erstes muss die Facebook-Klasse importiert werden:

<?php
  require_once 'facebook.php';
?>

Danach muss das Facebook-Objekt erstellt werden. Hierfür braucht ihr die Keys, die ihr bei der Registrierung bekomen habt:

<?php
  $appapikey = 'geheim';
  $appsecret = 'geheim';
  $facebook = new Facebook($appapikey, $appsecret);
?>

Login

Natürlich müsst ihr bei der Verwendung auf den User zugreifen. Dafür muss man das Login durchführen. Als Ergebnis bekommt man die Facebook User ID:

<?php
  $user_id = $facebook->require_login();
?>

DataStore

Der DataStore ist eine Datenbank Facebook, die man über die API ansteuren kann. Dort gibt es Objekttypen, Objekte & Association. Einen Objekttypen ist eine Art Klasse, die ein Objekt beschreibt. In unserem Beispiel nehmen wir das Objekttyp Note. Den Objekttyp erstellt man so:

<?php
  $facebook->api_client->data_createObjectType('note');
?>

Dieses Objekt kann nun bestimmte Eigenschaften haben. Da ich nur einen Text als Notiz speichere bekommt er die Eigenschaft text. Eigenschaften können folgende Typen sein:

  • 1: Zahlen
  • 2: Text 255 Zeichen
  • 3: Text bis zu 64kb

In unserem Fall habe ich mich für die 3 entschieden, woraus sich folgender Code ergibt:

<?php
  $facebook->api_client->data_defineObjectProperty('note','text',3);
?>

Jetzt haben wir die Struktur unserer Datenbank erstellt. Dafür brauchen wir natürlich Daten! Also müssen wir erst einmal ein Objekt vom Typen note erzeugen:

<?php
  $obj = $facebook->api_client->data_createObject('note',$test);
?>

Diesem Objekt weisen wir nun der oben erstellten $user_id zu:

<?php
  $facebook->api_client->data_setAssociation('note', $user_id, $obj);
?>

Um ein gespeichertes Objekt über den User wieder zu bekommen müssen wir data_getAssociatedObjects ausführen:

<?php
  $assocs = $facebook->api_client->data_getAssociatedObjects('note',$user_id);
?>

Als nächstes überprüfen wir, ob der Parameter text mit POST übergeben wurde. Ist das der Fall, speichern wir diesen in unser Objekt:

<?php
  if($_POST['text']){
   $facebook->api_client->data_setObjectProperty($assocs[0]['id2'],'text',$_POST['text']);
  }
?>

Formular

Fehlt nur noch das Formular mit der Ausgabe. Da beim ersten Aufruf noch kein Text vorhanden ist, habe ich das ganze (unsauber) im Try-Catch gebaut:

<html>
  <body>
    <h1>Notizblock</h1>
    <form method="POST">
      <textarea name="text" rows="20" cols="50">
        <?PHP
          try{
            echo $facebook->api_client->data_getObjectProperty($assocs[0]['id2'],'text');
          }
          catch(Exception $ex){
          }
        ?>
      </textarea><br />
      <input type="submit" value="Speichern" />
    </form>
  </body>
</html>

Zu guter letzt gibt es nochmal den Code des kompletten Notizblockes:

<?php
  require_once 'facebook.php';

  $appapikey = 'geheim';
  $appsecret = 'geheim';
  $facebook = new Facebook($appapikey, $appsecret);

  $user_id = $facebook->require_login();

  //Diesen Block nach dem ersten Aufruf entfernen
  $facebook->api_client->data_createObjectType('note');
  $facebook->api_client->data_defineObjectProperty('note','text',3);

  $assocs = $facebook->api_client->data_getAssociatedObjects('note',$user_id);

  if(!$assocs or sizeof($assocs) == 0){
 
  $obj = $facebook->api_client->data_createObject('note',$test);
  $facebook->api_client->data_setAssociation('note', $user_id, $obj);
  }

  if($_POST['text']){
    $facebook->api_client->data_setObjectProperty($assocs[0]['id2'],'text',$_POST['text']);
  }
?>
<html>
  <body>
    <h1>Notizblock</h1>
    <form method="POST">
      <textarea name="text" rows="20" cols="50">
        <?PHP
      try{
            echo $facebook->api_client->data_getObjectProperty($assocs[0]['id2'],'text');
      }
      catch(Exception $ex){
      }
        ?>
      </textarea><br />
      <input type="submit" value="Speichern" />
    </form>
  </body>
</html>

Das Ergebnis könnt ihr euch hier ansehen: http://apps.facebook.com/stevieswebsite/

Hilfsmittel

Bei developers.facebook.com gibt es das Tool API Testkonsole. Hier könnt ihr alle Funktionen der API einsehen und testen.

Wenn euch dieses Tutorial gefallen habt, könnt ihr mich ja mal als Freund hinzufügen, dort bekommt ihr auch alle Neuigkeiten von SteviesWebsite.

In Kürze (Stand 24.9.2010) kommt das Buch „Facebook Anwendungen programmieren“ in den Handel. Darin werden mit Sicherheit auch noch einige gute Beschreibungen erscheinen. Wer bei Veröffentlichung eine Benachrichtigung erhalten möchte, kann hierfür den Dienst Preisbuzzer nutzen.

Kommentare

Roman schrieb am 03.04.2010:

cool, danke Stevie, das werd ich bei Gelegenheit mal versuchen... ;o) Gruss

Stefan Wienströer schrieb am 03.04.2010:

danke dir ;-)

Justus schrieb am 04.04.2010:

Wow, vielen vielen Dank, großartig zusammengefasst!

Julian D. schrieb am 05.04.2010:

*thumbs up*

Christian schrieb am 07.04.2010:

Danke für die kleine Einleitung, wusste gar nicht das man so schnell und einfach eigene Apps für Facebook entwickeln kann. Werd ich mir in jedem Fall einmal genauer ansehen :)

Thomas schrieb am 13.05.2010:

Hey Danke für Deine kurze Einführung in die App-Problematik. Wirklich sehr hilfreich für den Einstieg. Viele Grüße, Thomas

Blogs sind nicht zum Geld verdienen! schrieb am 21.05.2010:

[...] ihr euch an das Tutorial Facebook Anwendung erstellen? Auf Grund dieses Beitrages habe ich bereits mehrere Anfragen bezüglich (bezahlter) Programmierung [...]

Bärbel Loy schrieb am 12.06.2010:

Guter Abriß und Einführung in die Apps von Facebook.

Benny schrieb am 14.06.2010:

Noch ein Tipp. Falls man den Fehler "invalid url" für das Feld "URL der Webseite" bekommt, dann muss an die URL noch ein "/" hinzugefügt werden. http://www.example.de (falsch) http://www.example.de/ (richtig)

Alex D. schrieb am 14.06.2010:

Hi, man sollte vielleicht dazu sagen, dass das nur für den alten PHP client gilt. Der auf http://wiki.developers.facebook.com/index.php/User:Client_Libraries zu finden ist. Dazu müssen alle Migrations deaktiviert sein. Hf

Michael schrieb am 24.09.2010:

Hey, bei mir kommt diese Fehlermeldung schon seit Monaten wenn ich den code 1:1 übernehme... Parse error: parse error, unexpected '{' in /httpdocs/index.php on line 32 CODE: Hier zeigt er mir immer ein Fehler api_client-&gt;data_getObjectProperty($assocs[0]['id2'],'text'); } catch(Exception $ex){ } ?&gt;

Michael schrieb am 24.09.2010:

api_client-&gt;data_getObjectProperty($assocs[0]['id2'],'text'); } catch(Exception $ex){ } ?&gt;

Stefan Wienströer schrieb am 24.09.2010:

Kannst du mir mal deine Datei per Mail zukommen lassen (API-Zugangsdaten ändern nicht vergessen)? Meine Mail-Adresse steht im Impressum: http://stevieswebsite.de/impressum/

Facebook Anwendungen die Du kennen solltest! schrieb am 20.10.2010:

[...] Leider ist das Anwendungsverzeichnis von Facebook etwas versteckt. Deswegen gibt es vor der Vorstellung der Anwendungen erstmal den Link: http://www.facebook.com/apps/directory.php [...]

Valentin schrieb am 16.11.2010:

Nur zur Info: Auf deiner Facebook-Test-Seite kommt ein Fehler: Fatal error: Uncaught exception 'FacebookRestClientException' with message 'unable to create object association' in /homepages/18/d262607771/htdocs/facebook/facebookapi_php5_restlib.php:3381 Stack trace: #0 /homepages/18/d262607771/htdocs/facebook/facebookapi_php5_restlib.php(2720): FacebookRestClient-&gt;call_method('facebook.data.s...', Array) #1 /homepages/18/d262607771/htdocs/facebook/index.php(17): FacebookRestClient-&gt;data_setAssociation('note', '1155872944', '5005173287525') #2 {main} thrown in /homepages/18/d262607771/htdocs/facebook/facebookapi_php5_restlib.php on line 3381

Stefan Wienströer schrieb am 16.11.2010:

schau ich mir mal an - seltsam

Stefan Wienströer schrieb am 17.11.2010:

Die Vorgehensweise ist veraltet und wird nicht Unterstützt! Am Wochenende werd ich nen neuen Artikel machen!

Ksenia Orlowa schrieb am 08.12.2011:

Also ich mus sagen das ding ist ja erstmal ganz ok, aber das Problehm besteht ja darin das man die Anwendung noch an eine zusätzliche Datenbanck binden kann so das die Daten (zu Werve Zwecken) quasi irgendwo gespeichert werden und dann kann man auch noch SPAMMEN während man die anwendung nutzt. Also kann man sogenannte Tojaner Apps endwickeln die Daten Sammeln und SPAMMEN!

Stefan Wienströer schrieb am 08.12.2011:

Spam ist sicher nicht das, was ich mit diesem Tutorial fördern möchte. Aber es ist ja auch nur ein Mittel, was missbraucht werden kannst. Genauso wie du ein Mail-Programm zum verschicken vom Spam-Mails nutzen kannst ;-)

Ksenia Orlowa schrieb am 08.12.2011:

Ich versuche gerade eine Facebook anwendung zu erstellen, nur auf was zeigt die Canavs URL, auf Canavs.aspx auf meinen Server oder direct auf die Default.aspx?? Ich bräuchte ne kleine erklärung was die Optionen bedeuten :)

Stefan Wienströer schrieb am 09.12.2011:

Kommt drauf an, was auf den Seiten steht ;-)