2011. február 21., hétfő

Alkalmazás létrehozása

A legelső alapkritérium, ami szerintem senkit sem fog meglepni: kell, hogy legyen egy Facebook profilunk. Ha van profilom, akkor már lehet saját alkalmazásom, aminek én leszek az adminisztrátora. Ezen kívül pedig még kell egy saját web-tárhely is, ahol a programom elhelyezem. Ha ezek adottak, mehetünk tovább.
Legelőször látogassunk el ide: http://www.facebook.com/developers/
Itt található a „Fejlesztő” alkalmazás, ami első látogatásunkkor engedélyt fog kérni az adatainkhoz. Ahhoz, hogy a Fejlesztőt felvehessük a saját alkalmazásaink közé, engedélyeznünk kell a hozzáférést.

Miután ez megtörtént, már láthatóvá válik egy olyan gomb, hogy „Új alkalmazás készítése”. Igen, jól sejtitek, ez lesz az :) Klikkeljünk csak rá bátran!
Máris két nagy döntéssel kell szembesülnünk. Az első: mi legyen az alkalmazásunk neve. A második: elfogadjuk e a Facebook szabályzatát. De az utóbbi esetében biztos, ami biztos… fogadjuk el :) Én azt a nevet adom most neki, hogy „myFirstApp”. Majd ráklikkelek a „Create App” gombra a program létrehozásához.

Ezután egy biztonsági ellenőrzés következik. Értelem szerűen be kell gépelni a két szót, amiket kissé elcseszetten, de azért látni vélünk, majd a „Küldés” gombra kattintunk. Ezt követően bejön egy aranyos kis profilocska, ahol egy csomó dolgot beállíthatunk a mi kis programunkkal kapcsolatban. Adhatunk róla egy rövidke leírást, adhatunk neki ikont, feltölthetünk egy képet logónak, stb… meg kell adnunk, hogy az alkalmazásban milyen nyelvet fogunk használni.

A baloldalon ezután menjünk a „Web Site” fülre, ahol más mezők kerülnek a szemünk elé. Itt ami igazán fontos lesz, az a „Site URL” szövegmező lesz, ahova be kell írnunk azt a címet, ahol a saját tárhelyünkön a program elhelyezkedik. Az én példámban ez az URL: „http://oldalam.hu/myapp/”, ami természetesen a „myapp” mappában lévő „index.php” fájlt fogja jelenteni.

Ezután a „Facebook Integration” fül következik, ahol ismét fontos információkat kell megadnunk, illetve feljegyeznünk. Az „Application ID” lesz az alkalmazásunk azonosítója, ezt majd alkalmaznunk is kell, úgy ahogy az „Application Secret” kódot is, ami viszont egyfajta jelszóként funkcionál, így azt ne adjuk mások tudtára! A „Canvas Page” résznél megadhatjuk, hogy milyen link-néven legyen majd elérhető az alkalmazás, a „Canvas URL”-nél pedig adjuk meg újra a program elérésének útvonalát. Alul pedig a „Canvas Type”-nál az legyen bejelölve, hogy „IFrame” típusú alkalmazást hozunk létre (mert ilyet fogunk létrehozni).

Minden lényeges dolgot beállítottunk, úgyhogy ezután alul menjünk a „Változások mentése” gombra. Láthatjuk a progink profilját, a lényegesebb adatokat…
De máris megyünk tovább: szükségünk lesz egy, a Facebook-kos kódok futtatását lehetővé tevő csomagra, amihez le kell töltenünk egy tömörített állományt a következő címről: http://github.com/facebook/php-sdk/tarball/master
Ennek a cuccnak a tartalmát, ami egy „facebook-php-sdk-2343fca” mappa, fel kell másolnunk a tárhelyünkre, hogy majd beágyazhassuk a PHP állományunkba a megfelelő fájlt.

Tehát akkor most a web-tárhelyünkön a megadott mappában vagyunk: van egy „index.php” állományunk és itt van már az előbb említett mappa is.

Az „example code” linkre kattintva jön elő egy lap, amint fent a bekeretezett részben látunk. A „2. lépés…” rész alatti kódot az „index.php” fájlunkba kell másolnunk. Láthatjuk, hogy szerepel benne az „appId” és a „secret” azonosítók is, amik egyértelműsítik, hogy erről az alkalmazásról van szó. A „facebook.php” eléréséhez kicsit módosítani kell az útvonalat annak megfelelően, hogy mi a mappa pontos neven, amiben elhelyezkedik.
Akkor jelenleg az „index.php” fájlunk valahogy így néz ki:


<?php
require_once ' facebook-php-sdk-2343fca/src/facebook.php';

$facebook = new Facebook(array(
'appId' => 'xxxxxxxxxx',
'secret' => 'yyyyyyyyyy',
'cookie' => true,
));


Természetesen az „x”-ek és „y”-ok helyére mindenki a saját „app” és „secret” azonosítóit gondolja oda. A „require_once” résznél pedig a fenti hivatkozás csak akkor lesz működőképes, ha tényleg a megadott „facebook-php-sdk-2343fca/src/facebook.php” elérési útvonalon keresztül érhető el a fájl az alkalmazás könyvtárából!
Most pedig még így a legelején megspékeljük valamivel a kis programot: hozzáteszünk egy kódot, amellyel hozzáférhetünk az aktuális felhasználó publikus adataihoz, persze mindezt kezdve azzal, hogy a legelső látogatáskor az alkalmazás hozzáférési engedélyt fog kérni. Ehhez még ennyi kód részlet kell:

$session = $facebook->getSession();
$me = null;
if ($session) {
try {
$uid = $facebook->getUser();
$me = $facebook->api('/me');
} catch (FacebookApiException $e) {
error_log($e);
}
}

if($me){
$logoutUrl = $facebook->getLogoutUrl();
}else{
$loginUrl = $facebook->getLoginUrl( array(
'canvas' => 1
, 'fbconnect' => 0
, 'req_perms' => 'read_stream,publish_stream,offline_access'
, 'display' => 'page'
));
echo "<script>top.location.href = '".$loginUrl."';</script>";
exit;
}
?>


A végén a PHP lezárás ki ne maradjon :) Nos, ebben a kódban a „$me” az „én” leszek, azaz az épp aktuális felhasználó. A lényeg, hogy ezekkel a cuccokkal elértük, hogy ha az alkalmazás még nincs hozzánk felvéve, akkor engedélyt kér. Sasoljuk csak meg az oldalt, ahol elvileg már működőképesen találhatjuk meg a kis proginkat (a példában ez volt a „http://apps.facebook.com/myfirstapp”, ezt mindenki maga tudja, hogy mit adott meg).

Ekkor már csak rá kell menni, hogy engedélyezzük, és máris használhatjuk az alkalmazást. Persze egyelőre nem fogunk utána semmi extrát tapasztalni, csak a nagy fehérséget, mivel még nincs megírva maga a program, se design nincs készítve :)
Azért mielőtt ezt az első „fejezetet” itt lezárom, egy apróságot még hozzáteszünk, hogy legyen legalább egy kis sikerélményünk: köszönjön nekünk a program. Írjuk hozzá a kódunkhoz az alábbi sort (természetesen a „?>” jelek elé):


print("Szia, ".iconv('utf-8','ISO-8859-2',$me['first_name'])."!");


Ha most frissítünk, annyi változást észlelünk, hogy kiírja: „Szia, XY!”, méghozzá a keresztnevünkön szólít minket (amennyiben be vagyunk jelentkezve). A következő bejegyzésben kifejtem, hogy itt mi mit jelent, majd tovább haladunk egy komolyabb program kifejlesztésében.