Skip to content

Instantly share code, notes, and snippets.

@chrismessina

chrismessina/Google XAuth Demo

Created April 19, 2010 17:32
Show Gist options
  • Save chrismessina/371328 to your computer and use it in GitHub Desktop.
Save chrismessina/371328 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Google XAuth Demo
<html>
<head>
<title>Google XAuth Demo</title>
<script type="text/javascript" src="http://xauth.org/xauth.js"></script>
<script type="text/javascript">
function doLogin(doneUrl) {
/* Tell XAuth.org that a user has just signed into Google on this browser. */
XAuth.extend({
// Just reveals "someone is logged into Google" but no personally identifiable info.
token: "1",
// Expires after 24 hours or if the user explicitly logs out (24h is arbitrary).
expire: new Date().getTime() + 60*60*24*1000,
// Allow any domain to read this info (could also whitelist partner domains only).
extend: ["*"],
// Optional callback function once extend() has completed.
callback: makeRedirectFunc(doneUrl)
});
}
function doLogout() {
/* Tell XAuth.org that a user has just signed out of Google on this browser. */
XAuth.expire({
// Optional callback function once expire() has completed.
callback: makeRedirectFunc("http://www.google.com/accounts/Logout")
});
}
// Will eventually be "www.google.com", but this demo is currently running on AppEngine.
var googleDomain = "googxauthdemo.appspot.com";
function doRetrieve() {
/* Ask XAuth.org if a user is signed into Google on this browser. */
XAuth.retrieve({
// Just looks to see if there's a session for google currently in XAuth.
retrieve: [googleDomain],
// Callback function to receive data returned from retrieve().
callback: onRetrieve
});
}
function onRetrieve(data) {
var numTokens = 0;
var str = '';
// Demo just prints out the returned XAuth session information.
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;
}
function makeRedirectFunc(doneUrl) {
return function() {
if (doneUrl) {
location.replace(doneUrl);
}
}
}
function doXauth() {
var params = parseQueryString();
if (params['action'] == 'login') {
doLogin(params['continue']);
} else if (params['action'] == 'logout') {
doLogout();
} else {
document.getElementById('pleasewait').style.display = 'none';
document.getElementById('instructions').style.display = '';
doRetrieve();
}
}
function parseQueryString() {
var params = [];
var qs = location.search.substring(1);
qs = qs.replace(/\+/g, ' ');
var args = qs.split('&');
for (var i = 0; i < args.length; i++) {
var pair = args[i].split('=', 2);
var name = decodeURIComponent(pair[0]);
var value = (pair.length == 2 ? decodeURIComponent(pair[1]) : '');
params[name] = value;
}
return params;
}
</script>
<style>
body {
padding: 0 30px;
margin: 0;
margin-top: 1em;
font-family: "Helvetica Neue", Helvetica, Arial;
}
.body {
width: 800px;
margin: auto;
}
hr {
margin:30px 0 30px 0;
}
#login_status {
background: #f0f0f0;
padding: 2px;
font-family: monospace;
}
</style>
</head>
<body onload="doXauth()">
<div class="body">
<div id="pleasewait">Please wait&hellip;</div>
<div id="instructions" style="display: none;">
<h2>What is XAuth?</h2>
<p>XAuth is a new open platform to extend authenticated user services across the web.</p>
<p><b>Google</b> can use <b>XAuth</b> to let other services know that a user is signed in to google.com. Those services can then create a user experience customized for Google users.</p>
<p>One such service, <b>Meebo</b>, has created a demonstration page where you can view XAuth in action. To view the demo:
<ol>
<li><a href="/?action=login&continue=http://googxauthdemo.appspot.com/">Sign in to Google with this link</a></li>
<li>Then head on over to <a href="http://meebo.com/xauth">http://meebo.com/xauth</a> and it will notice that you're signed into Google.</li>
<li>If you come back and <a href="/?action=logout">sign out with this link</a>, you'll no longer appear signed in to Meebo (or other sites).</li>
</ol>
<p>Current active sessions: <span id="login_status"></span></p>
<hr>
<p>Notes:</p>
<ul>
<li>This is just a temporary demo site, and it will go away once XAuth support is fully built into Google.</li>
<li>Being an XAuth provider or extender is really easy--just view source on this page and look for the <code>XAuth.extend</code> and <code>XAuth.retrieve</code> functions.</li>
<li>Currently, this XAuth provider writes an XAuth session with the domain <code>googxauthdemo.appspot.com</code>, but that will change to <code>www.google.com</code> once support is fully built into Google.</li>
<li>Normally, all of this will be invisible to users. When a user signs into Google, Google will inform XAuth, and when that user logs out, Google will expire that information from XAuth.</li>
</ul>
<hr>
<p>To learn more about XAuth, go to <a href="http://xauth.org/info">http://xauth.org/info</a>
</div>
</div>
</body>
</html>
Raw
xauth.js
var XAuth = (function () {
var i = !(window.postMessage && window.localStorage && window.JSON);
var e = "http://xauth.org/server.html";
var d = false;
var p = false;
var c = null;
var r = null;
function h(u, v) {
var t = Array.prototype.slice.call(arguments, 2);
function s() {
var w = (typeof v == "function" ? v : u[v]);
return w.apply(u, t.concat(Array.prototype.slice.call(arguments)))
}
s.methodName = v;
return s
}
var a = {};
if (window.postMessage) {
a.postMessage = {
subscribe: function (s, t) {
var u = function (v) {
var w = {
origin: v.origin,
data: v.data
};
setTimeout(h(s, t, w), 0)
};
if (window.addEventListener) {
window.addEventListener("message", u, false)
} else {
if (window.attachEvent) {
window.attachEvent("onmessage", u)
}
}
return u
},
unsubscribe: function (s) {
if (!s) {
return
}
if (window.removeEventListener) {
window.removeEventListener("message", s, false)
} else {
if (window.detachEvent) {
window.detachEvent("onmessage", s)
}
}
},
send: function (u, t, s) {
u.postMessage(t, s)
}
}
}
a.URL = function (s) {
var t = String(s).match(/^([^:\/?#]+:)?(?:\/\/)?([^\/?#]*)([^?\s#]*)?(\?([^#]*))?(#(.*))?$/);
if (t) {
return {
protocol: t[1],
host: t[2],
pathname: t[3],
search: (t[5] || ""),
hash: t[7]
}
} else {
return null
}
};
function n() {
if (d || p) {
return
}
d = true;
a.postMessage.subscribe(this, k);
var s = window.document;
c = s.createElement("iframe");
c.style.position = "absolute";
c.style.left = c.style.top = "-999px";
s.body.appendChild(c);
c.src = e
}
function k(u) {
var s = u.origin;
if (a.URL(s).host != a.URL(e).host) {
return
}
var v = JSON.parse(u.data);
if (!v) {
return
}
if (v.cmd == "xauth::ready") {
p = true;
d = false;
r = c.contentWindow;
setTimeout(g, 0);
return
}
if (typeof v.id == "number") {
var t = q[v.id];
if (t && t.callback) {
t.callback(v)
}
delete q[v.id]
}
}
var f = [];
var q = {};
var j = 0;
function g() {
for (var s = 0;
s < f.length;
s++) {
var t = f.shift();
t()
}
}
function l(t) {
t.id = j;
q[j++] = t;
var s = h(this, function (u) {
a.postMessage.send(r, JSON.stringify(u), e)
}, t);
if (d || !p) {
f.push(s);
n()
} else {
s()
}
}
function b(s) {
if (i) {
return
}
if (!s) {
s = {}
}
var t = {
cmd: "xauth::retrieve",
retrieve: s.retrieve || [],
callback: s.callback || null
};
l(t)
}
function o(s) {
if (i) {
return
}
if (!s) {
s = {}
}
var t = {
cmd: "xauth::extend",
token: s.token || "",
expire: s.expire || 0,
extend: s.extend || [],
session: s.session || false,
callback: s.callback || null
};
l(t)
}
function m(s) {
if (i) {
return
}
if (!s) {
s = {}
}
var t = {
cmd: "xauth::expire",
callback: s.callback || null
};
l(t)
}
return {
extend: o,
retrieve: b,
expire: m,
disabled: i
}
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment