How to log in to a website using a Twitter account
Websites that require a login have proliferated. Why make everyone create a unique login for every site? Well, because that was the only way to do it. And that was why the OAuth protocol was developed. This protocol allows you to login to website A using your credentials from website B. Furthermore site A can then use information and resources made available from site B.
Here we document the steps to use a social media account, in this case Twitter, to sign in to a website using the OAuth protocol. Our example uses a PHP library written by Abraham Williams.
It's probably worth setting up a couple of dummy Twitter accounts so you can play around with them (if that's what you want to do), because you will be able to tweet as, unfollow and generally manipulate the accounts in different ways, so you may not want to do this to your live account. I set up a dummy developer account and a dummy client account (my logger-inner)
1) The first step is to download the twitteroauth library from github
2) Copy the library to the root of your website
3) Then log in to https://dev.twitter.com/ and go to "My applications"
4) Create a new application. Your application will need the following values:
- Name: A name of your choosing (can't include the word Twitter)
- Description: An appropriate description
- Website: http://your-website.com
- Callback URL: http://your-website.com/callback.php. (Where callback.php is the file of that name that comes with the previously downloaded library.)
- When you agree to the terms and conditions and submit this form you will get back the following OAuth settings (amongst others, but these are the relevant ones):
- Consumer key (something like): 9YidvrFjfU7vn6yRlli7CQ
- Consumer secret (something like): 2s3RYYah6Ko9ilwwqr4gNl6KaMURSwrey7k8LaTP7vF
5) Now go to where you copied the library on your website and save config-sample.php as config.php and open it and insert the appropriate values:
define('CONSUMER_KEY', '9YidvrFjfU7vn6yRlli7CQ'); define('CONSUMER_SECRET', '2s3RYYah6Ko9ilwwqr4gNl6KaMURSwrey7k8LaTP7vF'); define('OAUTH_CALLBACK', 'http://your-website.com/callback.php');
6) OK, you should now be able to go to your website and see a "Sign in with Twitter" button.
7) You will be taken to a Twitter page asking you for authority to let your website use the dummy Twitter account. Log in using your dummy Twitter client.
8) Choose "Authorise App" and Twitter will redirect you back to your website and display a dump of the data from the user's Twitter account.
Working with the Twitter account data
If all you want is the login facility, you're done! But if you would like to interact with Twitter then read on.
The library comes with a file test.php, this file contains examples of many of the functions available for getting data from the signing in account and for manipulating the account data.
To be able to use all the functions you may need different levels of permissions. You can set these on the https://dev.twitter.com/ site under My Applications. Hit the Settings tab and scroll down to Application Type where you will find the different access levels you can set. When the user is signing into your site he will be told exactly what permissions you have set and if he/she wants to grant you those permissions.
You can now try http://your-website.com/test.php to see examples of all the function calls. There is rather a lot of information, I would recommend duplicating the file then deleting all the functions and just cutting and pasting one or two at a time. That's easier to digest and Twitter puts a limit on how many calls you can make over a given time so if you do them all at once there is a chance that you will max your limit out.
At the time of writing some of the methods and parameters aren't correct in test.php (TwitterOAuth v0.2.0-beta) . Probably because the twitter API has changed recently from version 1.0 to 1.1 and they haven't been updated.
You can find the correct parameters by going to the Twitter API 1.1 page and searching for the method you are interested in e.g. 'friendship/show' under API 1.1 https://dev.twitter.com/docs/api/1.1
How it works
There is a process of negotiation that goes on between your web server and Twitter to establish the authentication. This is described in the readme file for the library thus:
1. Build TwitterOAuth object using client credentials.
2. Request temporary credentials from Twitter.
3. Build authorize URL for Twitter.
4. Redirect user to authorize URL.
5. User authorizes access and returns from Twitter.
6. Rebuild TwitterOAuth object with client credentials and temporary credentials.
7. Get token credentials from Twitter.
8. Rebuild TwitterOAuth object with client credentials and token credentials.
9. Query Twitter API.
In the follow on article I describe how to set twitteroauth up in MODX