XAuth basics and an example.
What is XAuth?
XAuth is an open platform for extending authenticated user services across the web.
Participating services generate a browser token for each of their users. Publishers can then recognize when site visitors are logged in to those online services and present them with meaningful, relevant options.
Users can choose to authenticate directly from the publisher site and use the service to share, interact with friends, or participate in the site’s community. The XAuth Token can be anything, so services have the flexibility to define whatever level of access they choose.
How does it works
The main requirement for XAuth is you browser to support HTML5. XAuth essentially defines 3 different parties to the flow:
– Extenders are web services that a user is logged into that present some public API.
– Retrievers are web services that want to discover and consume one or more of the Extenders.
– XAuth.org is the final party. All communication of XAuth happens through an iframe and javascript This is just static hosting, all data is stored in the users browser.
Step 1: Enable
You can just put the following line into your website and it will be XAuth enabled:
<script type="text/javascript" src="http://xauth.org/xauth.js"></script>
Step 2:Become an Extender
Let’s create the token and let’s save it to our browser:
function doLogin(doneUrl) {
XAuth.extend({
token: "1", //set the token
expire: new Date().getTime() + 60*60*24*1000, // set the expire time
extend: ["talkweb.eu"], //allow this script to work only on your own domain
callback: location.replace(doneUrl)
});
}
Step 3:Become an Retriever
Let’s retrieve the token and show it on a web page :
function doRetrieve() {
XAuth.retrieve({
retrieve: ["talkweb.eu"],
callback: onRetrieve
});
}
function onRetrieve(data) {
var numTokens = 0;
var str = '';
if (data && data.tokens) {
for (var token in data.tokens) {
if (numTokens > 0) str += ', ';
str += token + ': ' + data.tokens[token].token;
numTokens++;
}
}
if (str == '') {
str = '(none)';
}
document.getElementById('login_status').innerHTML = str;
}