FB Connect
Autor: Slađan Nikolić |
Datum:
  • # 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.

fb-login

  • 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</