Facebook application yapımını öğrenelim..



Facebook application yapımı


İnternette bu konu hakkında Türkçe döküman sıkıntısı olduğunu gördüm. Facebook’un sayfasından kopyalanıp çevrilmiş dökümanlar yada anlatım eksikliği olan dökümanlar gözüme çarptı. Bu sebeple temel bir Facebook application’ın nasıl yaratılacağına dair bir döküman yazmak istedim. Mantığı bir kez kavradıktan sonra web programcısı için facebook uygulamaları yaratmak çocuk oyuncağı olacaktır.
Öncelikle bize php5 destekli bir host lazım. Php4 üstündede çalışma imkanı var. Fakat denemedim. O iş biraz daha teferruatlı. Ekstra şeyler yapmanız gerekiyor.

Ayrıca veritabanına kayıt yapacaksak ise mysql’de lazım.
Basit bir şekilde adım adım anlatmaya başlayalım;
Öncelikle Facebook’da profilimize giriyoruz ve “Facebook Developer” uygulamasını ekliyoruz. Ekledikten sonra sol menüde çıkan develepera tıklayarak
uygulamaya girdikten sonra sağ üst köşedeki “Set up new application” a basıyoruz.
Karşınıza Facebook uygulamanıza hangi ismi vereceğinizi belirleyeceğiniz form gelecek. Dilediğiniz bir ismi verin ve kullanım şartını onaylayarak uygulamanızı
Yaratın. Örn “deneme”
Uygulamamızı yaratmış olduk. Resimde görüldüğü üzere sadece bize ait olan bir “Api Key” ve “Secret” verilmiş oldu. Bunlar Facebook’un uygulamamızın güvenliği için uyguladığı kullanıcı adı ve şifre gibi birşey denilebilir.
Ardından “Edit Settings” e girerek uygulamamızla ilgili ayarlamaları yapmaya başlıyoruz. Optional fields kapalı ise tıklayarak açtıktan sonra “Callback URL”
bölümüne uygulamamızı barındırdığımız adresi yazıyoruz. Örn “http://www.alpgulec.com/facebook/”
“Canvas Page URL”ye ise Facabook’da uygulamamızın kullanacağı dizinin adını yazıyoruz. Örnhttp://apps.facebook.com/deneme
Ardından FBML’i seçiyoruz. FBML’i seçmemiz bizim için daha avantajlı ve kolay olmakta. FBML Facebook Markup Language oluyor.
FBML HTML gibi birşey. FBML’in Facebook’da kullanabileceğiniz kendine özgü tagları var ve güvenlik açısından sıkıntı yaratmayacak
HTML taglarınıda bünyesinde barındırmakta. Facebook’da sayfalarımızı FBML kurallarına göre oluşturuyoruz.
Kullanıcı uygulamayı ekledikten sonra güncelleyene kadar uygulama kutusunda uygulamanın arayüzü değişmeksizin aynı kalıyor. Dinamikleştirmek için
kullanılan bir yöntem var. Fakat temelde statik bir yapı düşünülmüş. Kullanıcı uygulamayı eklediğinde oluşturulan FBML kodu kaydediliyor ve
Güncellenene kadar hep aynı kalıyor. Örneğin Facebook’da bir takvim uygulaması yaptıysanız. Kullanıcı bunu Pazartesi günü güncellediyse o uygulama
güncellenene kadar hergün Pazartesi yazar. Başka bir kişi Çarşamba güncellediyse ondada Çarşamba yazar. FBML hakkında ayrıntılı bilgiyi
Formu doldurmaya devam edersek “Website” ı seçiyoruz. Uygulamamızın eklenebilmesi için “Can your application be added on Facebook”’u Yes olarak seçtikten
sonra Installion Options’a geçiyoruz.
“Who can add your application to their Facebook account?” bölümünde “Users” a tick koyup daha sonra Facebook sayfalarına eklenip eklenemeyeceğini belirliyoruz.
“No pages” yaparak o kısmı geçiyoruz.
Hemen altında “Post-Add URL” var. Buranın anlamı kullanıcı uygulamamızı ilk eklediğinde hangi adrese yönlendirileceği.
“Application Description” a uygulamamızın tanıtımını kafamıza göre yazıyoruz ve “Post-Remove URL” ye geçiyoruz.
Bu da uygulamamızı kimin kaldırdığını anlamamızı sağlıyor. Uygulama kaldırıldığında kullanıcı ilk eklendiğindeki gibi o sayfaya
yönlendirilmiyor. Facebook tarafından otomatik olarak bize kaldıran kullanıcıyla ilgili gerekli bilgiler gönderiliyor. Buraya
sitemizin direk yolunu yazmak zorundayız.
Altına geçtiğimizde “Default FBML” bölümünü görüyoruz. Kullanıcı eğer uygulamamızı profiline eklemişse fakat sitemizdeki uygulama sayfamızdan
FBML kodlarını elde edemişse(sitede aksaklık vs olabilir) standart olarak uygulama kutusunda gözükmesini istediğimiz FBML kodlarını, yazıları buraya yazıyoruz.
“Default Profile Box Colum” a geçtiğimizde “Wide” ve “Narrow” adında iki seçenecek görüyoruz. “Wide” ı seçersek uygulamamız eklendiğinde standart olarak
Sağdaki geniş alana yerleşiyor. “Narrow” seçili isede soldaki dar alana. Uygulamamızın görünümüne göre en uygun olanı belirleyip seçiyoruz.
Alttaki “Developer Mode” u da eğer sadece uygulama geliştiricilerinin eklemesini istiyorsak seçebiliriz.
Son olarakta “Side Nav URL” ye uygulamamız eklendiğinde kullanıcıların sol menüsünde çıkan linkin nereye yönleneceğini belirliyoruz.
Burası şimdilik bu kadar save’e basıyoruz ve sıradaki adımlara geçiyoruz.
İşin facebook tarafından sonra şimdi geldik bizim tarafımıza;
http://developers.facebook.com adresi sık sık işinize yarayacak. Daha fazla bilgi için buraya gözatabilirsiniz.
http://developers.facebook.com/documentation.php bölümünden Facebook apileri, FQL ve FBML hakkında kaynaklara ulaşabilirsiniz.
Facebook apileri kişi listesi alma,fql sorgulama,uygulama kutusunun FBML kodunu değiştirme gibi işlere yarıyor. Yani Facebook’un bize sunduğu fonksiyonlar.
FQL ise SQL’in Facebook’da ki yüzü diyebiliriz. Size kullanıcıların bilgilerini sorgulayabileceğiniz tablo isimleri, sütun isimleri vs verilmiş ve siz bunları
kullanarak kolayca bilgileri elde edebiliyorsunuz.
FBML’den ise yukarıda bahsetmiştim.
Ayrıca http://developers.facebook.com/tools.php adresinde yazdığınız FBML, FQL kodlarını ve Facebook apilerini kolay bir şekilde deneme imkanına sahipsiniz.
Şimdi sıradaki adıma geçiyoruz ve http://developers.facebook.com/clientlibs/facebook-platform.tar.gz adresinden bize gerekli olan Facebook kütüphane
dosyalarını indiriyoruz.
İçinde 3 klasör olacak.
-php4client (php4 için gerekli dosyalar)
-footprints (Örnek uygulama)
-client (Bizim işimize yarayacak sadece bu klasör)
Client klasörü hariç diğerleri bizim için gerekli değil. Client klasörü içerisinde 3 dosya olacak.
- facebook.php
- facebookapi_php5_restlib.php
- facebook_desktop.php
Uygulama dosyalarımızda include edeceğimiz bir dosyada biz hazırlıyoruz. Bu Facebook tarafından hazır bir şekilde sunulmuş bir örnek dilerseniz
farklı yollarıda deneyebilirsiniz. “appinclude.php” adında bir dosya yaratıp içine aşağıdaki kodları kopyalıyoruz. Bu sayede application anahtarlarımız
ve bazı bilgi ve işlemler tek dosyada oluyor. İşlerimiz daha kolay hal alıyor.
<?php
require_once ‘facebook.php’;
// Yukarıda uygulamamızı yarattığımızda bize verilen apikeyi ve secret anahtar değerlerini aşağıya yazıyoruz.
$appapikey = ‘uygulamamızın apikeyi’;
$appsecret = ‘uygulamamızın secretkeyi’;
$facebook = new Facebook($appapikey, $appsecret);
$user = $facebook->require_login();
// Yukarıda Callback URL’ye yazdığmız adresi alta yazıyoruz
$appcallbackurl = ‘uygulamamızı koyduğumuz adres’;
try {
if (!$facebook->api_client->users_isAppAdded()) {
$facebook->redirect($facebook->get_add_url());
}
}
catch (Exception $ex) {
$facebook->set_user(null, null);
$facebook->redirect($appcallbackurl);
}
Yukarıdaki kodları yazdıktan sonra kaydediyoruz ve nihayet kendi uygulamamızı yazma konumuna geliyoruz.
Bu uygulamamızda uygulamayı ekleyen kişiyi selamlayan basit bir örnek yazacağız.
Fakat içerisinde Facebook api, FBML, FQL ve bazı faydalı Facebook özelliklerini gösteren en temel ve gerekli şeyleride göstermeyi unutmadım. Bunları anladığınız
takdirde gerisi zaten çok kolay gelecektir.
<?php
require_once ‘appinclude.php’;     // Az önce yarattığımız genel dosyamızı include ediyoruz.
$uidno=$facebook->api_client->users_getLoggedInUser(); // Bizim facebook idmizi veren api
$kullanici=$facebook->api_client->fql_query(“select name from user where uid=”.$uidno); //Burada örnek fql görüyoruz. Facebook idmize göre ismimizi user
// tablosundan seçiyor.
$fbml.=”<fb:wide><center><b>Merhaba “.$kullanici[0][name].”</b></center>”;     //Evet burada da FBML koduna örnek görüyoruz. “<fb:wide>” ın anlamı
// sadece uygulama kutusu sağ tarafa taşınınca gösterilen kısımlardır. Ayrıca burada izin verilen html kodlarınıda kullandık ve kullanıcı selamladık.
$fbml.=”</fb:wide><fb:narrow><b><center>Uygulamayi sag bolmeye tasiyiniz.</center></b></fb:narrow>”; // Buradada sağ tarafta gösterilecek kısmı
// kapattık. Eğer uygulama sol tarafa taşınırsa gösterilmesini istemedik ve “<fb:narrow>” tagları içerisine aldık ve uyarı koyduk.
$fbml.=”<fb:subtitle><fb:action href=’http://apps.facebook.com/deneme/invite.php’>DavetEt</fb:action><fb:action href=’http://apps.facebook.com/deneme’>Güncelle</fb:action&gt;
</fb:subtitle>”; //Bunlarda uygulama kutusunun sağ üstünde gözüken Güncelle ve
// davet et linklerinin nasıl yaratıldığını gösteren uygulama. Gördüğünüz üzere Türkçe karakterlerde sıkıntı yaşanıyor. Bunu aşmak içinde utf-8 karakter seti kodlarını
// kullanmamız lazım. Aşağıdaki linkten özel karakterlerin karşılıklarına ulaşabilirsiniz.
$facebook->api_client->profile_setFBML(NULL,$user,$fbml,$profile_action,NULL); // Yukarıda gördüğünüz üzere hepsini fbml adında kendi yarattığımız
// bir değişkenin içerisine kolaylık olsun diye parça parça yazdık. Son olarak setFBML apisi ile uygulama kutusunun FBML kodunu değiştiriyoruz.
$facebook->redirect($facebook->get_facebook_url() . ‘/profile.php’); // Gerekli olan tüm kodları çalıştırdık son olarak profilimize yönleniyoruz.
?>
Bunu index.php olarak kaydediyoruz ve yukarıda gördüğünüz üzere birde davet etmekten bahsettim. Davet etmek için kullanılan örnek kod facebook tarafından
zaten sunulmuş. Onuda aşağıdan kopyalayıp invite.php olarak kaydediniz.
<?php
require_once ‘appinclude.php’;
$query=”SELECT uid FROM user WHERE has_added_app = 1 and uid in (SELECT uid2 FROM friend WHERE uid1=”.$user.”)”;
$rs = $facebook->api_client->fql_query($query);
$arFriends=”";
if ($rs) {
for ( $i = 0; $i < count($rs); $i++ )
{
if ( $arFriends != “” )
$arFriends .= “,”;
$arFriends .= $rs[$i]["uid"];
}
}
$sNextUrl = urlencode(“&refuid=”.$user);
$invfbml = <<<FBML
UYGULAMA ADI Uygulamasi
<fb:name uid=”$user” firstnameonly=”true” shownetwork=”false”/> tarafindan size yollandi.
FBML;
?>
<fb:request-form type=”UYGULAMA ADI” method=”POST” action=”?c=skipped” content=”<?php echo htmlentities($invfbml) ?>” invite=”true”>
<fb:multi-friend-selector max=”20″ actiontext=”UYGULAMA ADI uygulamasini arkadaslariniza gondererek haberdar olmalarini saglayabilirsiniz.” showborder=”false” rows=”5″ exclude_ids=”<?php echo $arFriends ?>” />
</fb:request-form>
Davet etme kısmını da hallettikten sonra elimizde olan 6 dosyayı Örnhttp://www.alpgulec.com/facebook klasörünün içine
- facebook.php
- facebookapi_php5_restlib.php
- facebook_desktop.php
- invite.php
- appinclude.php
- index.php
yukarıdaki dosyaları upload ediyoruz ve uygulamamız hazır hale geliyor. Geliştirmesi size kalmış.

Yorumlar