Igor Kulman

Ako na prihlasovanie cez Facebook Connect na vlastnom webe

· Igor Kulman

Prihlasovanie sa do diskusie pomocou služby Facebook Connect je už rovnako rozšírené, ako Facebook Like tlačidlo. V princípe ide o to, že ak sa chce návštevník vášho blogu zapojiť do diskusie, nemusí vypĺniť svoje meno, email a ďalšie povinné údaje, len jednoducho klikne na Facebook Connect tlačidlo a tieto údaje sa automaticky vyplnia z jeho profilu. Samozrejme len za predpokladu, že Facebook konto má a povolí prístup.

Ja som na svojom webe implementoval takéto prihlasovanie na vyplnenie mena, emailu a webu pre formulár na komentáre k článkom, ukážem vám ako na to. Aj prihlasovanie cez Facebook Connect je brané ako Facebook aplikácia, musíte si teda zaregistrovať novú Facebook aplikáciu. Pri jej registrácií je dôležité uviesť správnu adresu vášho webu a zapamätať si API Key, ktorý dostanete.

Do stránky následne pridajte Facebook Connect tlačidlo

<p><input type="image" src="http://mediacdn.disqus.com/1007/images/themes/narcissus/login-facebook.gif" id="login" onclick="FB.login(handleSessionResponse, {perms: 'email'});" /></p>

JavaScript pre Facebook Connect

<script src="http://connect.facebook.net/en_US/all.js"></script>

a samotný kód využívajúci knižnicu jQuery

<script> 
jQuery.noConflict(); 
FB.init({ apiKey: 'Vas API key' }); 
FB.getLoginStatus(handleSessionResponse); function handleSessionResponse(response) { 
  if (!response.session) { 
    clearDisplay(); 
    return; 
  } 
  
  FB.api( { method: 'fql.query', query: 'SELECT name, email, website FROM user WHERE uid=' + FB.getSession().uid }, function(response) { 
    var user = response[0]; 
    jQuery('#e_name').attr("value",user.name); 
    jQuery('#e_email').attr("value",user.email); 
    jQuery('#e_url').attr("value",user.website ); 
  }); 
} 
</script>

V aktuálnej verzii jQuery je však problém s vypĺňaním formulárových prvkov vo Windows verzií prehliadača Chrome, knižnica Prototype však funguje

$('e_name').value=user.name;
$('e_email').value=user.email; 
$('e_url').value=user.website;