Jeldrik Jeldrik - 17 days ago 6
Javascript Question

Ajax: HTTP Basic Auth and authentication cookie

I want to store the HTTP basic authentication headerline in an authentication

cookie
, so that I don't have to deal with the authorisation header in subsequent requests (I'm using
jQuery
):

authenticate: function(auth) {
var header = "Basic " + $.base64.encode(auth.username + ":" + auth.password);
document.cookie = "Authorization: " + header;
$.ajax({
type: "GET",
url: "http://someurl",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: auth.success,
error: auth.error
});
},


Whilst this seems to work for the first user who logs in, it doesn't work for any other users within the browser session, because the subsequent authorisation headers are added and not overwritten. I know that one could overwrite a cookie by using the
name=value
syntax, but this syntax does not apply to the authorization header.

Is there any way to get rid of the old authorization header once a new user logs in?

Any help would be appreciated. Thanks, JeHo

Answer

It seemd, that it didnt work for the first user either. The problem was, that the authorization header was probably set by the browser earlier on (when I used the authentication dialog of the browser). What I'm doing now is storing the login information in a standard name=value cookie and set the authorization header manually.

Set the cookie:

var header = "Basic " + $.base64.encode(auth.username + ":" + auth.password);
document.cookie = "Authorization=" + header;

Read the cookie:

function getAuthCookie() {
   var cn = "Authorization=";
   var idx = document.cookie.indexOf(cn)

   if (idx != -1) {
       var end = document.cookie.indexOf(";", idx + 1);
       if (end == -1) end = document.cookie.length;
       return unescape(document.cookie.substring(idx + cn.length, end));
   } else {
       return "";
  }
}

Set the authorization header:

    $.ajax({
        type: "GET",
        url: "http://someurl",
        contentType: "application/json; charset=utf-8",
        beforeSend: function(xhr) {
            xhr.setRequestHeader("Authorization", getAuthCookie());
        },
        dataType: "json",
        success: auth.success,
        error: auth.error
    });

This seems a bit awkward, but it works.

Comments