Hungarian (Magyar) translation by Szabó Péter (you can also view the original English article)
Szóval szeretnél egy Facebook alkalmazást készíteni és elérni – gyakorlatilag – több millió felhasználót. Nos szerencsére egy API-t használó alkalmazás megírását nem túl nehéz megtanulni (legalábbis ami az alapokat illeti). Ebben a bemutatóban egy Facebook alkalmazást készítünk, ami egy véletlenszerű idézetet generál a felhasználó adatlapján.
Fogjunk hozzá
Érdemes megjegyezni, hogy a Facebook API többféle nyelven is elérhető, ezek listája fent van a Facebook Developers Wikin. Ehhez a bemutatóhoz PHP 5-öt fogok használni. Le kell töltened hozzá a PHP 5 Client Library-t is, amit belevettem a forrásfájlok közé Minden itt leírt kódnak az index.php fájlba kell kerülnie.
1. lépés: Az alkalmazásod inicializálása
Az első lépés egy Facebook API kulcs megszerzése, ami lehetővé teszi az alkalmazásodnak, hogy információkat gyűjtsön a Facebooktól. Menj a Facebook Developer Applicationra és kattints a "Set Up a New Application" gombra. Válassz egy nevet, fogadd el a Felhasználási feltételeket, és megkapod az API-dat. Most be kell állítanod a vászon oldaladat és egy visszahívási URL-t.



A vászon oldalad oldalad az alkalmazás terület a Facebookon belül; a név hozzáadódik az URL-hez és valami ilyesmi lesz: http://apps.new.facebook.com/[ALKALMAZÁSNÉV]
. A visszahívási URL a szerverre mutat, ami az alkalmazás fájlokat biztosítja. Ezek beállításához a "My Applications" oldalon kattints az "Edit Settings"-re a jobb oldalon. Itt találod majd a kitöltendő mezőket, ahogyan az a lenti képernyőképen is látszik. Bár ezeken kívül még rengeteg más lehetőség is van, egyikre sincs szükség ehhez a bemutatóhoz. Kattints a "Save"-re és már készen is állsz az első Facebook alkalmazásod elkészítésére. Sőt, a Facebook még néhány kezdő kódot is biztosít a számodra. Kiszedtem belőle az extrákat, és csak azt adom meg neked, amire az alkalmazás inicializálásához szükséged van...



1 |
|
2 |
<?php
|
3 |
|
4 |
require_once 'includes/facebook.php'; |
5 |
|
6 |
$appapikey = '85e4cd7042467d0b20109aafb6f20117'; |
7 |
$appsecret = 'be5a528d73ad191b6b21a84c4af054ee'; |
8 |
$facebook = new Facebook($appapikey, $appsecret); |
9 |
$user_id = $facebook->require_login(); |
10 |
$callbackurl = 'http://www.casabona.org/nettuts/'; |
11 |
|
12 |
?>
|
Ez egy viszonylag előremutató kód. Létrehozunk egy Facebook objektumot az API kulcsunkkal és egy alkalmazás jelszóval, amit akkor kaptunk, amikor létrehoztuk az API kulcsot. Ezután az első dolog, hogy megszerezzük a bejelentkezett felhasználó user id-ját. Ez értékes lesz számunkra, ha szeretnénk mindenfélét csinálni a felhasználónévvel, a felhasználó barátaival, stb. Hozzáadtam egy $callbackurl
-t, hogy könnyebb legyen hozzákapcsolni képeket vagy más fájlokat, mivel a Facebook nem engedélyezi a relatív hivatkozásokat.
2. lépés: Az alkalmazás megírása
Ha nem csinálunk specifikus Facebook meghívásokat, akkor ez csak egy php alkalmazás megírásából áll. Lentebb itt van a mi kódunk.
1 |
|
2 |
//initialize an array of quotes
|
3 |
$quotes= array("Only those who dare to fail greatly can ever achieve greatly.", "Take my wife. Please!", "I believe what doesn't kill you only makes you... STRANGER"); |
4 |
|
5 |
//Select a Random one.
|
6 |
$i= rand(0, sizeof($quotes)-1); |
7 |
|
8 |
//print the CSS
|
9 |
print (' |
10 |
<style type="text/css">
|
11 |
h1{ margin: 10px; font-size: 24pt; }
|
12 |
h2{ margin: 15px; font-size: 20pt; }
|
13 |
</style>
|
14 |
'); |
15 |
|
16 |
print "<h1>Nettuts Quotes</h1>"; |
17 |
print "<h2>". $quotes[$i] ."</h2>"; |
Csak ennyit kell tenned, hogy kiírasd a vászon oldalra. Érdemes megjegyezni a módot, ahogyan a CSS-t csináltuk. Nem hívhatunk meg egy fájlt, például a style.css-t – valójában bele kell vennünk a CSS-t a HTML-be. Így a saját CSS kódunk nem keveredik össze a Facebook-éval. Azt is érdemes tudni, hogy amikor diveket stilizálunk, csak osztályokat használhatunk, egyedi azonosítókat nem. Az általunk létrehozott kód valami ilyesmit fog eredményezni:



3. lépés: Az adatlapi box létrehozása
Végül következzék némi Facebook-specifikus dolog. A lenti kód szükséges ahhoz, hogy az idézetünket a felhasználó adatlapjához adhassuk, ez garantálja, hogy megjelenjen az alkalmazásunk az adatlapjukon. Az alkalmazásunkban hozzáadtam a következő kódot $i= rand(0, sizeof($quotes)-1);
1 |
|
2 |
//prepare string for profile box
|
3 |
$text= (' |
4 |
<style type="text/css">
|
5 |
h1{ margin: 10px; font-size: 24pt; }
|
6 |
h2{ margin: 15px; font-size: 20pt; }
|
7 |
|
8 |
</style>
|
9 |
'); |
10 |
|
11 |
$text.=('<h2>'. $quotes[$i] .'</h2>'); |
12 |
|
13 |
|
14 |
//set profile text
|
15 |
$facebook->api_client->profile_setFBML($text, $user_id); |
Vedd észre, hogy két dolgot csináltam itt: újranyomtattam a CSS-t és mindent egy $text
nevű stringbe pakoltam. Ez azért kellett, mert a függvény, ami beállítja az adatlapi box szövegét, a profile_setFBML
-t, két argumentumot kap; a szöveget, ami az adatlapi boxba kerül és a felhasználó id-jét. A vászon oldalon definiált CSS nem kerül bele az adatlapba, így hozzá kell adnunk azt az első argumentumhoz. A végeredmény ez lesz:

Ennyi!
Nyilvánvalóan csak a felszínét kapargattuk annak, amire a Facebook alkalmazás-fejlesztők képesek. Ugyanakkor a Wikivel és az API kulccsal együtt megkapott Facebook erőforrásokkal jó úton vagy afelé, hogy létrehozd a következő nagy alkalmazást! Ha szeretnéd ezt az alkalmazást megnézni teljes pompájában, akkor menj ide, már amennyiben van egy Facebook-fiókod.