FB Connect

Autor: Slađan Nikolić |

Datum: 08.04.2013 17:00

# Tutorijali

Otkako su veliki sistemi otvorili svoja vrata drugim, manjim aplikacijama ostvario se san armije lenjih korisnika interneta - korišćenje jednog naloga za pristup različitim servisima. Da bi se prilagodili ovim zahtevima svi ti manji sistemi morali su prilagoditi svoje resurse. Svedoci smo da većina postojećih i gotovo bez izuzetka svi novi servisi imaju ovu opciju. Razlozi su više nego očigledni - u trenutku pisanja ovog teksta Facebook ima preko 1.06 milijardi korisnika (od kojih se svakodnevno prijavi njih 584 miliona), Twitter ima preko 500 miliona korisnika, LinkedIn preko 110 miliona korisnika. Tema ovog teksta biće Facebook ( u daljem tekstu FB ) login i kako sa njim povezati naše aplikacije ili web sajt.

U prethodnom članku opisao sam kako da kreirate facebook aplikaciju. Da bismo naučili kako da povežemo aplikacije sa FB iskoristićemo postojeća podešavanja uz male izmene. U delu gde biramo način na koji ćemo FB aplikaciju integrisati sa FB - om uklanićemo deo o podešavanju Page Tab aplikacije i obratićemo pažnju na podešavanje Website with Facebook Login dela.

Site URL: Ovde unosimo adresu sajta na kome će se nalaziti FB login. U našem primeru to će biti http://www.phpsrbija.rs. Za razliku od FB aplikacija, sajt ne mora da bude na https protokolu.

Dozvole

Dozvole koje ćemo zahtevati od korisnika imaju izuzetno važnu ulogu. Budući da je privatnost vrlo osetljiva stvar, moramo voditi računa koje dozvole ćemo zahtevati od korisnika. Broj dozvola koje zahtevamo od korisnika obrnuto je srazmeran broju korisnika koji to prihvataju. Stoga moramo tačno znati koji su nam podaci potrebni i u skladu sa tim odrediti i nivo dozvola koje zahtevamo od korisnika.

Dozvole su podeljene u 6 grupa:

Public Profile and Friend List -Odnosi si se na osnovne korisničke podatke i listu prijatelja. Ovi podaci nam postaju dostupni nakon što se korisnik prijavi na našu aplikaciju i nije potrebno da zahtevamo nikakave dodatne dozvole. Polja koja su nam javno dostupna su:
- name
- first_name
- last_name
- link
- username
- gender
- locale
- age_range
Email Permissions - Izdvojen je u posebnu grupu najverovatnije iz razloga osetljivosti prema neželjenoj pošti i uznemiravanju korisnika. Kao što joj samo ime kaže ova grupa se sastoji iz samo jedne dozvole - email. Koristićemo je kada nam je neophodan email korisnika koji se prijavio na naš sajt preko FB.
Extended Permissions - Predstavlja dozvole koje se odnose na interakciju sa korisnikom. Nakon što korisnik prihvati ovu grupu dozvola, između ostalog, bićemo u mogućnosti i da:
- objavljivanje na zid korisnika
- čitanje notifikacija
- kreiranje događaja
Extended Profile Properties - Dozvole iz ove grupe nam omogućavaju pristupanje dodatnim podacima o korisniku. Te dodatne opcije između ostalih su:
- datum rođenja
- status veze
- grupe kojima korisnik pripada
Open Graph Permissions - Ovoj grupi pripadaju dozvole koje se odnose na rad sa Open graph - om. Kreiranja proizvoljnih akcija i objekata.
Page Permissions - Jos jedna grupa sa samo jednom dozvolom - manage_pages. Ova dozvola nam omogućava da administriramo i uređujemo FB stranice koje korisnik poseduje.

Realizacija FB logina

FB login se moze realizovati na tri načina:

Korišćenjem FB JavaScript SDK na klijentu
Logovanjem na FB serverskoj strani
Korišćenjem FB PHP SDK

JavaScript SDK

Pretpostavimo da na stranici imamo dugme Facebook Login i da je učitana jQuery biblioteka. Da bismo koristili FB biblioteku moramo je prvo učitati na stranicu. Unećemo sledeći kod koji će nam omogućiti tu funkcionalnost:

Pored osnovnih informacija koje nam FB dostavlja i za koje nam nisu potrebne dozvole zahtevaćemo dozvolu za email i publish_action dozvolu koja nam omogućava objavljivanje na zid korisnika. Budući da se FB API učitava asihrono, od izuzetne je važnosti da sve listen-ere inicijalizujemo odmah nakon njegovog učitavanja, u delu predvidjenom za to. Pogledajte jos jednom kod iznad da bi vam bilo jasnije.

Funkcija kojom bismo obavili logovanje izgledala bi ovako:

function handleFBLogin(){
    FB.login(function(response) {
        if (response.authResponse) {
            // Korisnik je prihvatio trazene dozvole i ulogovao se. Mozemo zahtevati informacije o njemu
            FB.api('/me', function(response) {
                response je objekat koji sadrzi informacije o  korisniku, nacin na koji cete iskoristiti te informacije je na vama
            });

        } else {
            //Korisnik je odustao od logovanja ili nije prihvatio trazene dozvole
        }
    },{scope:'email,publish_action'});
}

Logovanje na FB serverskoj strani

Tokom podešavanja aplikacije bili smo u obavezi da unesemo Site url, što naravno nije nikakav problem ukoliko posedujemo web stranicu na koju hoćemo da implementiramo FB login. Šta da radimo u slučaju kad radimo sa desktop aplikacijama ili Chrome esktenzijama koje uopšte nemaju ili imaju promeljiv URL. U takvim slučajevima pristupamo FB login - u sa serverske strane. Za ovakav način implementacije FB login-a nije potrebna nikakva eksterna biblioteka. Dovoljno je da pozovemo sledeci URL:

 https://www.facebook.com/dialog/oauth?
        client_id=YOUR_APP_ID
       &redirect_uri=https://www.facebook.com/connect/login_success.html
       &scope=COMMA_SEPARATED_LIST_OF_PERMISSION_NAMES
       &response_type=token

Gde je:

YOU_APP_ID: Id FB aplikacije koju smo kreirali
COMMA_SEPARATED_LIST_OF_PERMISSION_NAMES: Lista dozvola koje zahtevamo od korisnika odvojene zapetom

Nakon procesa autorizacije FB će nas preusmeriti na stranicu:

https://www.facebook.com/connect/login_success.html#
    access_token=USER_ACCESS_TOKEN...

Na kojoj ce se u hash - u nalaziti nas access_token. Kada imamo token dostupne su nam i ostale informacije o korisniku. Da bismo do njih došli dovoljno je da uradimo sledeće:

$url = "https://graph.facebook.com/me?access_token=ACCESS_TOKEN..."

$curlSession = curl_init();

curl_setopt( $curlSession, CURLOPT_URL, $url );
curl_setopt( $curlSession, CURLOPT_FOLLOWLOCATION, 1 );
curl_setopt( $curlSession, CURLOPT_RETURNTRANSFER, true );
curl_setopt( $curlSession, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.2) Gecko/20100115 Firefox/3.6 (.NET CLR 3.5.30729)" );
curl_setopt( $curlSession, CURLOPT_TIMEOUT, 25 );

$content = curl_exec ( $curlSession);
$err = curl_errno( $curlSession);
$errmsg = curl_error( $curlSession);
$header = curl_getinfo( $curlSession);

curl_close ($curlSession);

if  ( !$error )
{
//Buduci da u odgovoru dobijamo JSON potrebno ga je parsirati zbog lakse manipulacije
$content = json_decode( trim( $content ), TRUE );
}

Promenljiva $content predstavlja asocijativni niz koji sadrži podatke o korisniku. Logovanje preko FB serverske strane možemo iskoristiti i na web sajtu s tim da promenljiva redirect_uri mora biti url koji smo uneli u ranijem podešavanju aplikacije.

Korišćenje PHP SDK

Facebook PHP SDK predstavlja set funkcionalnosti za rad sa facebook API - em. Koristi se na serverskoj strani i omogućava rad sa Graph Api-jem i FQL - om. Obično se koristi za operacije administriranja apliakcije ali može da se upotrebi i za opsluživanje svih korisnika aplikacije. PHP SDK možemo naći na sledećoj adresi. Da bismo instalirali PHP SDK potrebno je da otpakujemo skinuti fajl i da sadržaj foldera src iskopiramo u naš projekat. Da bismo koristili PHP SDK potrebno je samo da uključimo facebook.php tamo gde nam je potreban i da instanciramo objekat. Objekat instanciramo na sledeći način:

  require_once("facebook.php");

  $config = array();
  $config[‘appId’] = 'YOUR_APP_ID';
  $config[‘secret’] = 'YOUR_APP_SECRET';
  $config[‘fileUpload’] = false; // optional

  $facebook = new Facebook($config);

Gde je:

YOUR_APP_ID: Id naše FB aplikacije
YOUR_APP_SECRET: App secret naše FB aplikacije

Ako bismo hteli da procesiramo prijavljivanje uz pomoć FB to bismo uradili ovako:

$params = array(
  'scope' => 'email, publish_actions',
  'redirect_uri' => 'https://phpsrbija.rs'
);
$loginUrl = $facebook->getLoginUrl($params);

Gde je:

scope: lista dozvola koje zahtevamo od korisnika odvojene zapetom
redirect_uri : redirect url na koji cemo biti preusmereni nakon prijave

Pozivanjem metode getLoginUrl dobijamo URL koji je potrebno pozvati kako bismo se prijavili na aplikaciju. Ovaj URL je identičan onom koji smo pominjali u delu za Logovanje na FB serverskoj strani, tako da je dalji proces identičan. Upravo iz tog razloga PHP SDK se slabije koristi za proces logovanja jer uz manje truda dobijamo istu stvar.

Dohvatanje podataka o korisniku takodje možemo realizovati pomoću PHP SDK. Zapravo možemo pozivati graph api. Primer kako možemo da dohvatimo recimo podatke o korisniku:

$fbUserID = $facebook->getUser();
$userInfo = $facebook->api("/$fbUserID");

Metoda getUser nam vraća ID ulogovanog usera na našu aplikaciju.

Metoda api služi za rad sa Graph Api - em i u ovom slučaju pozivanjem $facebook->( /$fbUserId ); dobijamo isto kao i kada bismo pozvali sledeći URL:

http://graph.facebook.com/$fbUserId

Sada kada smo na kraju, nadam se da vam je funkcionisanje FB login - a i njegova realizacija malo jasnija. Moja sugestija je da koristite JS SDK kada god je to moguće, prvenstveno zbog boljeg korisničkog doživljaja budući da nema ponovnog učitavanja stranice ili eventualno odlaska sa iste. Na serverskoj strani koristite Graph Api. PHP SDK, iako veoma dobar, nešto je što možemo da izbegnemo, a da ne izgubimo "udobnost" u radu sa FB - om, najviše zbog toga što ne želimo da vodima računa o kompatibilnosti verzija PHP SDK ili ne želimo da imamo tudji kod u našem projektu ako to nije neophodno.