Twitter OAuth, Hoe begin je ermee?

Geschreven door: Tom Claus

Sociale media zijn niet meer weg te denken van het internet, ze worden ook alsmaar meer en meer geïntegreerd in moderne websites. In een vorige blogpost haalden we zo al even aan wat de voordelen/nadelen waren van OpenID, Login With Twitter, Login With Facebook etc. Maar hoe begin je nu aan de integratie van deze services? In deze blogpost leggen we je uit hoe je via Twitter Oauth enkele gegevens van Twitter gebruikers kan raadplegen of gebruiken in je website.

Twitter Oauth, Hoe begin je ermee?

Om op een snelle en gemakkelijke manier connectie te kunnen maken met Twitter, maken we gebruik van enkele libraries. Om de komende uitleg wat te vergemakkelijken heb ik deze libraries en enkele voorbeeldpagina's in een zip bestand gestoken zodat jullie direct aan de slag kunnen.

Als basis heb je 3 bestanden nodig, een login pagina waar je je bezoeker naartoe stuurt en waar deze naar Twitter gestuurd zal worden om zijn logingegevens in te vullen. Hierbij komt een callback pagina waarnaar de bezoeker gestuurd zal worden van zodra deze succesvol is ingelogd bij Twitter. En als 3de hebben we nog een pagina waarop we bepaalde handelingen kunnen doen met de account van de gebruiker. In dit geval zullen we de login-gegevens ophalen en een Tweet plaatsen. Deze drie bestanden kan je uiteraard ook terugvinden in de voorbeelden.

Maar eerst, onze applicatie registreren!

Alvorens we aan de slag kunnen gaan met de voorbeeldcode, moeten we eerst beschikken over de juiste access-tokens van Twitter. Deze kan je bekomen door een Twitter applicatie te registreren op de Twitter website.

Bij het invullen van het formulier kan een naam en omschrijving opgegeven worden voor je applicatie. Waar je zeker rekening mee moet houden is de correctheid van je callback-url. Dit is de link naar je website waar je het callback bestand (in ons geval callback.php) geplaatst hebt. Verder zijn de rechten ook van groot belang: heb je enkel leesrechten nodig of ook schrijfrechten. Schrijfrechten heb je bijvoorbeeld nodig wanneer je een Tweet gaat plaatsen op het profiel van de gebruiker.

Wanneer je applicatie is geregistreerd krijg je enkele tokens terug van Twitter. Zo gaan we Consumer key en de Consumer secret opslaan in onze config. Ook onze callback url slaan we op in de config omdat we deze ook op een later tijdstip gaan nodig hebben.

De volgende code ga je in de 3 bestanden nodig hebben. Vul hier je Consumer Key en Secret in die je van Twitter hebt gekregen, je gaat deze steeds nodig hebben wanneer je een connectie wil maken met Twitter.

<?php
/**
 * Head / Config
 */
require_once('libs/twitteroauth.php');

$config_twitter_consumer_key 	= '';
$config_twitter_consumer_secret = '';
$callback_url			= '';
?>

1. Aanmelden bij Twitter

Op de login pagina gaan we aan de hand van onze 2 Tokens/Key's een connectie opbouwen met Twitter. Deze connectie zal ons 2 tijdelijke OAuth-Tokens terugsturen die we vervolgens opslaan in een sessie. Van zodra deze opgeslagen zijn bouwen we een connectie-url op die ons naar de login-pagina van Twitter zal sturen.

/**
 * Login
 */
session_start();

// We zetten een Twitter connectie op aan de hand van onze eigen keys.
$connection = new TwitterOAuth($config_twitter_consumer_key, 
	$config_twitter_consumer_secret);
 
// Aan de hand van onze callback-url kunnen we nu een token aanvragen 
// om de gebruiker naar de login pagina te sturen.
$request_token = $connection->getRequestToken($callback_url);

// We gaan de gekregen tokens opslaan in een sessie.
$_SESSION['oauth_token'] = $token = $request_token['oauth_token'];
$_SESSION['oauth_token_secret']   = $request_token['oauth_token_secret'];

// We vangen voor de veiligheid nog even op of de connectie goed gelukt is.
switch ($connection->http_code) {
  	case 200:
	// We controlleren de status van Twitter
    	$url = $connection->getAuthorizeURL($token);
    	header('Location: '.$url); 
    	break;
  	default:
    	die('Could not connect to Twitter.');
}

2. Callback from Twitter

Nadat de gebruiker zich ingelogd heeft via de Twitter website komt hij terug op de callback pagina. Op deze pagina gaan we de tokens genereren die ons toegang geven tot het profiel van de gebruiker. Dit doen we aan de hand van onze eigen Consumer Key en Secret, de OAuth tokens en een paramater die Twitter ons bezorgde via de login-pagina. Na het genereren van de Access-tokens kunnen we deze opslaan in een sessie of onze database. Wanneer we deze opslaan in een database, kunnen we hier gemakkelijk op een later tijdstip handelingen mee uitvoeren. Van zodra de Access Tokens zijn aangemaakt en opgeslagen, kunnen we onze tijdelijke OAuth tokens verwijderen en de gebruiker doorsturen naar de actie pagina.

/**
 * Callback
 */
session_start();

// We controleren onze tokens vanuit de login.php.
if (isset($_REQUEST['oauth_token']) && 
		$_SESSION['oauth_token'] !== $_REQUEST['oauth_token']) {
  	$_SESSION['oauth_status'] = 'oldtoken';
  	header('Location: login.php');
}

// Op basis van de OAuth-tokens en onze tokens bouwen we een connectie op.
$connection = new TwitterOAuth(
	$config_twitter_consumer_key, 
	$config_twitter_consumer_secret, 
	$_SESSION['oauth_token'], 
	$_SESSION['oauth_token_secret']
);	

// Nu gaan we de access-tokens opbouwen.
// De REQUEST paramater komt van Twitter tijdens de login.
$access_token = $connection->getAccessToken($_REQUEST['oauth_verifier']);

// De access-token gaan we nu in een sessie opslaan.
// Indien je op later tijdstippen handelingen met dit profiel gaat doen, 
// moet je deze opslaan in een database.
$_SESSION['access_token'] = $access_token;	

// We onze tijdelijk oauth_token nu verwijderen.
unset($_SESSION['oauth_token']);
unset($_SESSION['oauth_token_secret']);

// We controleren even op een geldige connectie. 
if (200 == $connection->http_code) {
	
	$_SESSION['status'] = 'verified';
  	
  	// Alles ziet er correct uit!
  	// We sturend e gebruiker naar de actie-pagina.
  	header('Location: post-tweet.php');
  	
}else{
 	die('Could not connect to Twitter.');
}

3. Tijd voor acties

Nu we over de Access-Tokens van de gebruiker beschikken kunnen we hier een connectie mee opbouwen en er tal van acties mee uitvoeren. Dit kan gaan van het posten van een Tweet, het ophalen van zijn gegevens tot het veranderen van de gebruiker zijn profielfoto en achtergrond. In het onderstaande voorbeeld halen we alle gegevens van de ingelogde gebruiker op.

Op de Twitter Developers pagina's kan je tal van functies terugvinden die je kan oproepen met de $connectie variabele.

/**
 * Tijd voor een actie, Haal de gegevens op 
 */
session_start();

if (!empty($_SESSION['access_token']) && 
	!empty($_SESSION['access_token']['oauth_token']) && 
	!empty($_SESSION['access_token']['oauth_token_secret'])) {
    
	// We nemen de access_token van de sessie.
	$access_token = $_SESSION['access_token'];
			
	// Op basis van OAuth-tokens en onze tokens bouwen we een connectie op
	$connection = new TwitterOAuth(
		$config_twitter_consumer_key, 
		$config_twitter_consumer_secret, 
		$_SESSION['oauth_token'], 
		$_SESSION['oauth_token_secret']
	);	
				
	// Met deze connectie kan je tal van acties uitvoeren.
	// Hieronder halen we de gebruiker zijn gegevens op.
	$authuser = $connection->get('account/verify_credentials');
	
	// Even al de gegevens van de gebruiker weergeven.
	var_dump($authuser);
	
	// Via onderstaande 2 regels plaats je een Tweet.
	$params = array('status' => 'Hello World');
	$status = $connection->post('statuses/update', $params);
	
}else{
	header('Location: login.php');
}

Zelf moet je wel de overweging maken welke acties je gaat uitvoeren. Als je bijvoorbeeld Twitter OAuth gaat gebruiken om gebruikers in te loggen op je reactie-formulier, kan je best geen achtergronden of profielfoto's gaan veranderen van de gebruiker. Hier zou je namelijk nogal eens mee in de problemen kunnen geraken.

Tip: Force Login

Zelf hebben we gemerkt dat er soms problemen zijn met de login-methode van Twitter, zeker wanneer je bezoeker over meerdere Twitter accounts beschikt. Zo kan het soms zijn dat deze onder het verkeerde account toegang verleent aan je toepassing. Door één regeltje aan te passen in de twitteroauth.php file kan je de gebruiker forceren in te loggen. Zo is deze steeds zeker dat hij onder het juiste account gebruik maakt van je toepassing.

// twitteroauth.php regel 99
return $this->authenticateURL()."?oauth_token={$token}&force_login=false";
	
// aanpassen naar force_login=true
return $this->authenticateURL()."?oauth_token={$token}&force_login=true";

Meer informatie nodig?

Nog op zoek naar de voorbeeldcode? Download deze hier. Voor meer informatie over Twitter OAuth en de vele mogelijkheden hiermee kan je ook terecht op de developer website van Twitter.

Heb je verder nog vragen omtrent Twitter OAuth stel ze gerust of laat ons zeker weten waar je deze methode hebt toegepast in je web-applicatie.

4 Reacties op deze blogpost:

Stijn
Dirk
Door Dirk op 18 januari 2011

Ik vind de Twitter auth zeker handig op veel sites. En ook altijd een geruststelling dat de site niet aan je login en wachtwoord kan. Wat veel mensen niet weten is dat je de toegang tot een app/site ook terug kan uitschakelen op deze pagina: http://twitter.com/settings/connections

Sam Tollenare
Door Sam Tollenare op 19 januari 2011

Zeer handige blogpost, was net op zoek naar een goede handleiding met wat extra tips!

Bas Matthee
{* Remarketing tag *}