Auslesen öffentlicher Facebook Alben mit der Graph API
29. Dezember 2010 
23 Comments
Wer braucht schon eine Facebook App, wenn es auch so locker aus der Hüfte funktioniert: In meinem ersten Artikel zeige ich wie man mit wenigen Zeilen PHP Code Alben und Fotos aus dem Graph API kitzeln kann. Das funktioniert allerdings nur mit (öffentlichen) Facebook Seiten und nicht auch mit den Alben eines Benutzerprofiles. Für letzteres bräuchte man dann doch eine App und die notwendigen Permissions, aber dazu vielleicht in einem späteren Artikel.
Der Zugriff auf das Graph API ist recht simpel und immer wie folgt:
https://graph.facebook.com/[ID]/[Verbindungstyp]
[ID] kann die ID eines Benutzerprofiles sein, die ID einer Seite, Veranstaltung, Gruppe, Applikation, eines Albums, Fotos, Videos usw. – Es kann allerdings auch die Vanity URL verwendet werden.
[Verbindungstyp] kann bei einer Facebook Seite zum Beispiel “albums” sein, um die Alben der jeweiligen Seite zu erhalten:
Auslesen der Alben (albums.php)
Am Beispiel meiner Vereinsseite zeige ich das Auslesen der Alben per Graph API:
$contents = file_get_contents('http://graph.facebook.com/bladauhu/albums?fields=id,name,type');
$albums = json_decode($contents,true);
$albums = $albums['data'];
foreach ($albums as $row)
{
if ($row['type'] == 'normal')
{
echo '<a href="photos.php?albumid=' . $row['id'] . '">';
echo $row['name'];
echo '</a><br>';
}
}
Durch Angabe des Parameters “fields” wird die Ausführung beschleunigt, indem man nur die Inhalte anfordert welche man auch wirklich braucht. Im angegebenen Fall also die ID, der Name und der Typ des Albums. Der Typ kann folgende Werte annehmen:
- profile: Profilfotos
- wall: Pinnwand-Fotos
- normal: Selbst erstelltes Album
Im obigen Beispiel wollen wir also nur die selbst erstellten Alben anzeigen. Die Funktion file_get_contents liefert uns einen JSON-String den wir gleich in der nächsten Zeile mit json_decode (PHP >= 5.2.0 vorausgesetzt!) in ein assoziatives Array verwandeln. Zur Übersicht kann man übrigens den Graph-Link jederzeit direkt in der Adresszeile des Browsers eingeben und erhält direkt die gewünschten Daten im JSON Format.
Ab Zeile 5 befindet sich eine handelsübliche foreach-Schleife, nach der Abfrage ob es sich um ein normales Album handelt wird jeweils ein Link zur Fotoseite (photos.php) ausgegeben. Sortiert sind die Alben absteigend nach ihrem Erstellungsdatum. Das Coverbild eines Albums erhält man übrigens mit dem Verbindungstyp “picture”:
http://graph.facebook.com/[Album-ID]/picture
Die Grafik ist nicht skaliert und sollte als Hintergrundbild zentriert verwendet werden:
background-position: center center; background-repeat: no-repeat;
Auslesen der Fotos (photos.php)
Die Fotos erhält man ähnlich unkompliziert mit ein paar wenigen Zeilen:
$albumid = $_GET['albumid'];
$contents = file_get_contents("http://graph.facebook.com/$albumid/photos?limit=30");
$photos = json_decode($contents,true);
$photos = $photos['data'];
foreach ($photos as $row)
{
echo '<img src="' . $row['images'][1]['source'] . '" /><br>';
}
Auch hier gilt wieder: Die Eingabe des Graph Links aus Zeile 2 direkt in die Adresszeile des Browsers liefert alle Fotodaten im JSON-Format (Die Album-ID muss man natürlich manuell eintragen). Zum Verständnis der Codezeilen absolut empfehlenswert und sinnvoll.
Das “images” Array beinhaltet für jedes Foto 4 Versionen, jeweils mit den Parametern “height”, “width” und “source” (Direkter Link zum Foto):
Index | Beschreibung |
|---|---|
| 1 | Foto in Originalgrösse |
| 2 | Proportional skaliert auf eine Breite von 180 Pixel |
| 3 | Proportional skaliert mit langer Seite auf 130 Pixel |
| 4 | Proportional skaliert auf eine Breite von 75 Pixel |
Unterschiedliche Fotos innerhalb eines Albums müssen also entweder per PHP auf bestimmte Grössen skaliert werden, oder man verwendet eines der 4 Fotos im “images” Array wie das Albumcover als Hintergrundbild. Per Lightbox Bild Nummer 1 aufpoppen lassen und fertig ist die Bildergalerie.
Limit/Paging
Die Anzahl der zurückgelieferten Elemente per Aufruf des Graph API ist standardmässig auf 25 gesetzt, je nachdem wie viele Bilder man in seiner Galerie pro Seite darstellen will muss dieser Wert angepasst werden. Im obigen Code wurde dafür der Parameter “limit” angegeben, es werden also 30 Fotos angezeigt.
Natürlich will man im Normalfall nicht nur die ersten x Fotos anzeigen. Paging unterstützt die Graph API ebenfalls, dafür gibt es den Parameter “offset”. Die Graph API Aufrufe für die nächsten bzw. voherigen x Fotos muss man sich jedoch nicht selbst zusammenbasteln, in den JSON-Daten werden dafür zwei Links mitgeliefert:
"paging": {
"next": "http://graph.facebook.com/388843868683/photos?limit=30&offset=60",
"previous": "http://graph.facebook.com/388843868683/photos?limit=30&offset=0"
}
Ein nettes Zusatzfeature für eine tolle Facebook-Galerie wäre dann natürlich die Anzeige aller Kommentare zu einem Foto, das geht ebenfalls recht einfach über das Graph API:
http://graph.facebook.com/[Photo-ID]/comments
Die Formatierung der Alben und Fotos überlasse ich euch, hier geht es nur um die Sammlung der Daten 
Falls es Fragen zum Artikel gibt: Immer her damit. Wenn ich Lust habe und der Mond richtig steht dann beantworte ich sie vielleicht sogar.
Links
Der erste Blogpost ist der Schwerste! Guter Artikel, go go go!
Na bestens! Die nächste schreibende Limette. Bist schon in meiner Blog-Roll.
Hey, super Beitrag – mich würde interessieren ob folgendes möglich ist:
ich möchte die Eventliste ( also Veranstaltungsliste) meines Profils auslesen lassen und auf meinem Blog darstellen.
Ist das möglich? wenn ja wäre ich über einen Tipp wie ich diesbzgl. vorgehen sollte sehr sehr dankbar.
ps: natürlich am besten ohne das sich der Benutzer bei Fb anmelden muss.
Eine App brauchst du dafür in jedem Fall, über den Graph-Link “http://graph.facebook.com//events” kommst du auf die Liste der Events. Sollte aber auch funktionieren indem man für einen User “Offline-Access” als Permission definiert und über diesen dann alles ausliest. Vielleicht kann man aber ohne Offline-Access auch auf die Liste zugreifen, immerhin ist sie im Prinzip öffentlich.
Hey, Super Blogbeitrag, was mir besonders gut gefällt ist dass man kein App auf Facebook erstellen muss. Gibt es eine einfache Möglichkeit das ganze noch zu cachen ? …
Gruß+Danke
Danke fürs Lob! Für ein Caching müsste man im Prinzip nur die Bildlinks zwischenspeichern, zumindest wäre das meine erste Idee.
Hey das ist ein sehr angenehmer Beitrag. Danach lässt sich das alles sehr gut nachvollziehen und programmieren
Danke
Doch habe ich ein kleines Problem und hoffe es kann mir einer helfen.
Problem:
Würde gerne für jedes offene Album auch die Comments und Likes auslesen.
Weiß nicht genau wie ich an die Daten rankomme bzw wie ich am einfachsten an die Daten komme.
meine Version:
————————
$contents = file_get_contents(“http://graph.facebook.com/$albumid/likes?fields=name”);
$albums = json_decode($contents,true);
$albums_likes = $albums['data'];
$contents = file_get_contents(“http://graph.facebook.com/$albumid/likes?comments”);
$albums = json_decode($contents,true);
$albums_comments = $albums['XXXXX'];
—————————-
Wie man sieht, habe ich zwei file_get_contents eingefügt. Jeweils für Likes und Comments.
Meine erste frage:
Gibt es hier schon eine leichtere Möglichkeit alles in einem Befehl zu verarbeiten?
Dazu kommt noch, dass ich nicht genau weiß wie ich bei den Comments an den Namen komme.
Frage1: Muss ich wirklich zwei File_get_contents Befehle einfügen damit ich an die Likes und comments komme?
Frage2: Wie komme ich bei den comments an den Namen und den Kommentar der der Person?
Hoffe es ist verständlich geschreiben und ich bedanke mich schonmal =)
LG micha
Hi! Danke fürs Lob
Zu deinen Fragen: Ohne Facebook App wird es wohl nur mit 2 file_get_contents Aufrufen funktionieren, mit einer Facebook App gäbe es die Möglichkeit mit FQL (Facebook Query Language).
An alle Kommentare eines Albums inkl. Name und sogar Facebook ID kommst du hiermit: “https://graph.facebook.com/$albumid/comments”
Da danke ich dir schonmal für die zügige und hilfreiche Antwort. Und ein kleines sorry für meinen falschen Code bzw schlechte Problemschilderung.
Hatte natürlich auch den von dir vorgeschlagenen Link benutzt nur ist mir beim kopieren ein Fehler unterlaufen. Hatte das Problem, dass ich nicht genau wusste, wie ich bei der Ausgabe den Arrayzeiger auf das Feld NAME bekomme. Nun habe ich es hinbekommen und hoffe dies ist der richtige Weg.
——————-
$albumid=$_GET['albumid'];
$contents = file_get_contents(“http://graph.facebook.com/$albumid/comments”);
$albums = json_decode($contents,true);
$albums_comments = $albums['data'];
foreach ($albums_comments as $row)
{
echo $row['from']['name'].”";
echo $row['message'].”";
}
—————–
Sollte einer (der noch schlechter im programmieren ist als ich) auch auf dieses Problem stoßen, somit ist ihm hiermit bestimmt geholfen =)
Danke =)
Micha
Hallo!
Ich habe ein Problem beim auslesen des jeweiligen Album-Covers…
wie wäre denn der Code um ein Ergebnis für die Albenseite zu erzielen, wie du es auf der SV Blada-Seite gemacht hast?
hi! das ist einfach, das album-cover bekommst du mit diesem graph-url: http://graph.facebook.com/$albumid/picture
hm, das hab ich zwar vorher schon gelesen, aber ich weiß nicht wie ich es in Folge anwende, weil im Beispiel oben haben wir die Fields geholt und dann müsste ich das gleiche nochmal extra für das Cover machen – müsste es dann aber die Variable contents2 nennen oder so – wodurch der die foreach schleife nicht mehr geht… Ich glaub ich hab irgendwo einen Knoten in meinem Gedankengang.. :/
Also das hier ein Blödsinn oder? :
$contents = file_get_contents(‘http://graph.facebook.com/bladauhu/albums?fields=id,name,type’);
$albums = json_decode($contents,true);
$albums = $albums['data'];
$contents = file_get_contents(‘http://graph.facebook.com/bladauhu/picture’);
$albums = json_decode($contents,true);
$albums = $albums['data'];
okay – die API durchlesen bringts… Schon gelöst!
statt “bladauhu” im zweiten “file_get_contents” aufruf muss natürlich die id des albums stehen, sonst funktioniert es nicht. ist aber generell nicht die optimalste lösung, da für jedes einzelne album ein zusätzlicher api-aufruf passiert. aber in jedem fall die einfachste lösung
und vorsicht, im ersten aufruf holst du dir alle alben die du dann in einer schleife abarbeiten musst, innerhalb der schleife muss dann der zweite aufruf für das profilbild des albums sein.
Hallo!
Ich wüsste gerne wie ich ein Album, dass ich auf der Facebook-Seite gelöscht habe auch auf der Webseite auf der ich die Alben ausgebe, rausbekomme!
Du scheinst das gleiche Problem bei der Blada uhu-Seite bei einem Album zu haben!
LG Lukas
hi,
ich habs mir mal angesehn, das album war bei mir scheinbar noch vorhanden (ohne bilder). probier mal folgendes:
-) http://graph.facebook.com/album-id im browser eingeben
-) den “link” kopieren und aufrufen
…damit sollte das angeblich gelöschte album aufscheinen und du kannst es löschen.
lg
Andi
ah, super – danke! Hat geklappt!
LG
Danke sehr !
Hi,
ich versuche in meinem Blog eine Facebookgruppe zu integrieren, finde aber leider keine passenden WP-Plugins die mir die Fotoalben der Gruppe auslesen und anzeigen. Facebook Photo Fetcher macht schon einen guten Job, kann allerdings keine Alben in der Gruppe auslesen, nur das Hauptalbum der Gruppe.
Embed Facebook wird nicht mehr weiterentwickelt, so dass ich das etwas abändern möchte, dafür bräuchte ich einen Link der mir mittels der OpenGraph die Alben einzeln anzeigt, gibt es sowas?
in der graph api doku gibt es für die alben einer group keine connection, eventuell wäre es per FQL möglich diese auszulesen…aber laut meiner erfahrung hinkt der zugriff auf daten einer gruppe über das api sehr stark hinter allen anderen hinterher (user profile, page, …).
Ich bin zwar ein asp.net endwickler, aber ich habe Facebook mal übel als CMS für meine Homepage Missbraucht in den ich einfach meine Homepage mit Daten einer Facebook seite füttere.
Die Daten werden jedesmal über ein DataContractDeserialisierer (ASP.NET / NET.FRAMEWORK) Deserialisiert und dann als klassen in den Hauptspeicher meines Servers geladen. Sogar ein Cache habe ich da.
Könntest du vielleicht noch mehr solcher Tutorials machen
würde gerne etwas mehr daraus machen