jQuery HTTP authentication

Question

With jQuery I am calling Version One Rest API and need to authenticate user in HTTP header.

I tried

$.ajax({
        dataType: "jsonp",
        beforeSend: function(xhr){
            xhr.setRequestHeader("Authorization", "Basic xyz"); // xyz usr:pwd Base64 encoded
        },
        url: "https://www10.v1host.com/.../VersionOne/rest-1.v1/...",
        success: function(data, status, xhr) {
            alert("Load was performed.");
        }
    });

and

$.ajax({
    dataType: "jsonp",
    username:"usr",
    password:"pwd",
    url: "https://www10.v1host.com/.../VersionOne/rest-1.v1/...",
    success: function(data, status, xhr) {
        alert("Load was performed.");
    }
});

But I always get pop up asking for my credentials (I use Chrome). Even when I type credentials in the pop up, I am not authenticated and the window keeps showing.

How to authenticate user with jQuery in HTTP headers?
Is there any way how make password attribute encrypted invisible? Or Base64 is the only way. I want to access server via only one account but do not want users on client side to see the password (or find it in javascripts).

"I want to access server via only one account but do not want users on client side to see the password" - that is going to be impossible with this method unless you fetch the password from server side (which feels like a bad practice). Base64 encoding is NOT a way to make a password invisible, it is childishly easy to revert. — Pekka
– Pekka, Commented Jan 6, 2011 at 22:55
Thanks. I was afraid that this is impossible. That's right about Base64, agree. — padis
– padis, Commented Jan 6, 2011 at 22:59

mu is too short · Accepted Answer · 2012-03-20 15:40:06Z

4

This isn't exactly impossible, just a little bit awkward. You can proxy all the AJAX through your own server like this:

Your JavaScript contacts your server via AJAX.
Your server sets up the request to https://www10.v1host.com/.../VersionOne/rest-1.v1/... with the appropriate basic auth headers (or whatever authentication you need to use).
Your server sends the response back to your script exactly as www10.v1host.com sent it to your server.

This way the password stays invisible and under your control on the server and the client code gets the same API as it would from www10.v1host.com. There might be a little bit of lag introduced with this approach but that should be manageable.

Of course, you still have to consider the authorization process between the browser and your server but you should be able to use whatever authorization you already have for that (probably cookies and plain old logins).

You'll also want to check this technique against the API terms of service to make sure you're playing nice.

edited Mar 20, 2012 at 15:40

answered Jan 7, 2011 at 0:23

mu is too short

436k71 gold badges863 silver badges822 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

padis Over a year ago

Thanks, that is a great idea. I actually originally wanted to call that REST API via Java on the server side but the server runs on the machine that cannot get to outer network. The client machines are allowed to get outside.

Collectives™ on Stack Overflow

jQuery HTTP authentication

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related