Ajax mit HTTP Basic Auth (YUI)
Für eine Adobe AIR Anwendung an der ich grade arbeite verlangt die Server- Schnittstelle eine Authentifizierung per HTTP Basic Auth. Klar ist ein Basic Auth nicht immer die erste Wahl beim Einsatz von Ajax, aber eine Authentifizierung über Cookies und Sessions zu implementieren, wenn die Anwendung eigentlich nur einen einzigen Aufruf tätigt ist zu viel des Guten.
Was die Sicherheit angeht, sollte der Aufruf des Servers über HTTPS, also SSL verschlüsselt, erfolgen, denn sonst könnte das Passwort mitgelesen werden. Hat man diese Voraussetzung erfüllt macht ein HTTP Basic Auth eigentlich schon Sinn, wenigstens für diesen Anwendungsfall.
Eine (etwas zu kurze) Recherche hat gezeigt, dass eigentlich kein JavaScript Framework mit Ajax Funktionalität eine simple Möglichkeit bietet mit HTTP Authentifizierung zu arbeiten. Deshalb hier mal ein kleines Beispiel, wie man XHR (XmlHttpRequest) Aufrufe mit der YUI Bibliothek mit HTTP Basic Auth realisieren kann.
YAHOO.util.Connect.initHeader( 'Authorization', build_auth_header('username', 'password') ) var resp = YAHOO.util.Connect.asyncRequest( 'POST', 'http://example.com/api/submit/', ajaxCallback, postdata )
Die Funktion build_auth_header() erzeugt durch Base64 codierung aus
Username und Passwort die Daten für einen HTTP kompatiblen Authorization-Header
und sieht wie folgt aus:
build_auth_header: function(user, password) { var tok = user + ':' + password; var hash = Base64.encode(tok); return "Basic " + hash; }
Die Funktion benutzt die encode Methode aus der Base64 Klasse vom Webtoolkit, diese Datei muss man vor dem Code auf seiner Seite einbinden.
Inspiriert durch ein ExtJS Beispiel auf Coder's Eye.
Für Prototype oder Mootools ist das ganze auch brauchbar (hier Mootools, bei Prototype mit requestHeaders anstatt headers):
function build_auth_header(user, password) {
var tok = user + ':' + password;
var hash = Base64.encode(tok);
return "Basic " + hash;
}
window.addEvent('domready', function(){
var auth = build_auth_header('user', 'pw');
var out = $('out');
var myAjax = new Ajax('http://www.url.com/protected/my.php', {method: 'post',
data: {action: 'dowhat'},
update: out,
headers: {'Authorization': auth}
});
myAjax.request();
});
Geschrieben von Stefan 1 Monat, 3 Wochen nach Veröffentlichung des Blog-Eintrags am 20. Dez. 2007, 22:02. Antworten
've modified your code to work in my own YUI project, but it does not rewrite the 'Authorization' field in the POST header. Do you have to use YAHOO.util.Connect.resetDefaultHeaders() or YAHOO.util.Connect.setDefaultPostHeader()? I've actually tried these and they don't help. But I was wondering if there's something I missed.
Thanks for any help - I appreciate it.
Geschrieben von D J Padilla 5 Monate, 1 Woche nach Veröffentlichung des Blog-Eintrags am 3. April 2008, 06:42. Antworten