I’m working on mini-demo project for OpenStack Swift. To keep things very simple and easy to understand, I decided that the whole demo would work in JavaScript in the browser. I also choose to use RackSpace’s CloudFiles as a Swift target for testing since they have the same API are are universally available (unlike my lab systems).
One advantage of this approach is that FireBug makes it very nice to debug and check the activity of the code. Unfortunately, FireBug also seems to eat the headers that I need. *Let me phrase that in a google friend way so that someone else will not loose the 2 hours I just lost*
“XmlHttpRequest setRequestHeader FireFox Not Respected when using FireBug”
It works great in Safari. So onward and upward. So far, I’ve got step #1 ready – getting the authorization token back from the cloud site.
Here’s the HTML page (you need jQuery too). Basically, it uses the username and key from the inputs to set “x-auth-user” and “x-auth-key” header attributes. These attributes will allow Swift to return a token that you can use on future requests when you want to do useful work.
<!DOCTYPE html>
<html>
<head>
<title>Dell Swift Demo [0.0]</title>
<script src=”jquery.js” type=”text/javascript”></script>
<script type=”text/javascript” charset=”utf-8″>
var xmlhttp = null;
function swiftLogin() {
var usr = $(‘input:text[name=usr]’).val();
var key = $(‘input:text[name=key]’).val();
// code for IE7+, Firefox, Chrome, Opera, Safari (UR SOL IE<7)
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function() //callback
{
if (xmlhttp.readyState==2)
{
$(‘#status’).replaceWith(xmlhttp.getResponseHeader(“X-Auth-Token”));
}
}
xmlhttp.open(‘GET’,’https://auth.api.rackspacecloud.com/v1.0′, true);
xmlhttp.setRequestHeader(‘Host’, ‘auth.api.rackspacecloud.com’);
xmlhttp.setRequestHeader(‘X-Auth-User’, usr);
xmlhttp.setRequestHeader(‘X-Auth-Key’, key);
xmlhttp.send();
}
</script>
</head>
<body>
<div id=”credentials”>
<fieldset id=”credentials” class=””>
<legend>Swift Login</legend>
<label for=”user”>User: </label><input type=”text” name=”usr” value=”user” id=”user”>
<label for=”key”>Key: </label><input type=”text” name=”key” value=”key” id=”key”>
<input type=”button” name=”Login” value=”login” id=”Login” onclick=”swiftLogin();”>
</fieldset>
</div>
<div id=”status”>[pending]</div>
<div id=”footer”>Time?</div>
<script type=”text/javascript”>
$(‘#footer’).replaceWith((new Date).toString());
swiftLogin();
</script>
</body>
</html>
Rob Hirschfeld 
Pingback: Tweets that mention OpenStack Swift Demo (in a browser) « Rob Hirschfeld's Blog -- Topsy.com
Pingback: OpenStack Swift Retriever Demo Online (with JavaScript xmlhttprequest image retrieval) « Rob Hirschfeld's Blog