JeuWeb - Crée ton jeu par navigateur
[Ruby] Implémenter Sign in with Twitter - Version imprimable

+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [Ruby] Implémenter Sign in with Twitter (/showthread.php?tid=5367)



[Ruby] Implémenter Sign in with Twitter - Sephi-Chan - 08-04-2011

Implémenter Sign in with Twitter avec Ruby

Parfois, on apprécie de pouvoir authentifier un utilisateur via son compte Twitter, Facebook, Google, etc. Le gros avantage de ces solutions, c'est que l'utilisateur n'a pas à donner de mot de passe, on évite ainsi le syndrome du "même mot de passe (presque) partout". De plus, lors des visites suivantes, il suffit de cliquer sur le fameux bouton Sign in with Twitter pour être connecté instantanément.

Dans cet article, nous allons voir comment implémenter Sign in with Twitter avec Ruby. Pour cela, nous allons créer une application Web toute bête avec Sinatra, que j'appellerais MyApp.

L'application permettra seulement de se connecter via Twitter, sans aucune forme d'inscription. Un compte utilisateur sera crée à la volée lors de la première connexion.


OAuth en gros

La fonctionnalité Sign in with Twitter utilise le protocole OAuth (dans sa version 1.0a), qui consiste à échanger des informations entre le Service Provider (ici, c'est Twitter) et le Consumer (ici, MyApp) avec l'aval de l'utilisateur (User).

Voici une présentation rapide du fonctionnement d'OAuth. Pour avoir le détail, il suffit de lire la documentation officielle, complète et plutôt simple : http://oauth.net/core/1.0a/). Nous utiliserons ici une librairie qui nous mâchera le travail (la partie pénible qui consiste à signer les requêtes avec des concaténations).

  1. L'utilisateur se rend sur votre site et voit le bouton Sign in with Twitter. Comment il dispose d'un compte Twitter, il décide de l'utiliser
  2. Ce bouton pointe vers une page interne de votre site (/twitter/sign_in par exemple) qui va demander à Twitter un jeton, le request token puis rediriger l'utilisateur sur une page du site de Twitter (/oauth/authenticate) en lui transmettant (sous forme d'un paramètre GET) le jeton et une URL de retour sur le site (callback)
  3. L'utilisateur se connectera à son compte Twitter s'il ne l'est pas déjà, puis pourra autoriser ou non l'application MyApp à accéder aux information de son compte Twitter
  4. Si l'utilisateur autorise l'application, il sera redirigé vers MyApp (à l'URL de callback transmise plus tôt). Twitter transmet quelques paramètres GET à cette page : le jeton demandé plus tôt et un code de verification
  5. Notre serveur contacte alors Twitter en lui transmettant ce jeton et son code de vérification pour obtenir en retour un autre jeton : l'access token.

L'access token agit comme un mot de passe : quand MyApp souhaitera effectuer une action sur le compte de l'utilisateur, il transmettra ce jeton dans la requête afin de dire : je suis MyApp, l'utilisateur Lambda m'a autorisé à agir en son nom. La preuve : j'ai l'access token.

Ici, nous n'utiliserons pas d'appel à l'API mais on va se servir des relations que Twitter a tissé avec MyApp pour connecter l'utilisateur facilement. En effet, Twitter est maintenant au courant que l'utilisateur accepte que MyApp accède aux informations du compte, et donc ne demandera plus d'autorisation à l'utilisateur. Ainsi, quand l'utilisateur se déconnectera de MyApp puis s'y connectera à nouveau, il sera directement redirigé sur MyApp, sans étape supplémentaire (éventuellement, s'il n'est pas connecté à Twitter, il devra le faire).

À tout moment, un utilisateur peut révoquer l'autorisation qu'il a donné au site en se rendant sur son profil Twitter.


Pour pouvoir demander des jetons à Twitter, une application doit être déclarée sur Twitter, afin d'obtenir des clés pour s'identifier auprès de Twitter en tant que MyApp. Pour créer une application Twitter, on va sur https://dev.twitter.com/apps/new et on remplit un formulaire tout bête. Le nom de l'application doit être unique. Pour l'URL du site, vous pouvez mettre localhost, pour ma part j'utilise http://app.dev. Le nom de domaine app.dev est déclaré dans mon fichiers hosts et pointe sur l'IP locale 127.0.0.1. Pour le callback, j'ai mis http://app.dev/twitter/callback mais cette information a peu d'importance puisqu'on transmet nous-même l'URL de callback au sein de l'application; comme l'exige OAuth 1.0a.


Implémentation

Il faut maintenant implémenter tout ça ! Nous allons pour cela développer notre application avec Sinatra. Un micro framework pour Ruby très simple.

Voici le code source de app.rb annoté, générée avec Docco.

Le code source est disponible sur GitHub. Les fichiers importants sont app.rb et views/home.haml ! Smile