Ajax authentication with jQuery

Question

I'm able to recieve the requested xml with

curl -X GET -u username:password url

but not with

$.get('url',
        {username:"username",password:"password"},
        function (data) {


        });

No javascript errors, no cross domain policy issues. It might be a syntax error but I failed to find a decent tutorial yet. Any suggestions please?

possible duplicate of [How to use Basic Auth and Jquery and Ajax](http://stackoverflow.com/questions/5507234/how-to-use-basic-auth-and-jquery-and-ajax) — Manse, Apr 19 '12 at 10:42
@fotis can you explain about the curl command ? is it in any browser ? shoudl i download something ? — Royi Namir, Apr 19 '12 at 11:04
@RoyiNamir It's a [php command](http://php.net/manual/en/book.curl.php) but you can run it on a linux terminal. — Fotis Adamakis, Apr 19 '12 at 11:39

score 23 · Accepted Answer · edited May 16 '14 at 22:58

23

I think you'd need the plain format :

$.ajax({
    type: 'GET',
    url: 'url',
    dataType: 'json',
    //whatever you need
    beforeSend: function (xhr) {
        xhr.setRequestHeader('Authorization', make_base_auth(user, password));
    },
    success: function () {});
});

function make_base_auth(user, password) {
    var tok = user + ':' + password;
    var hash = btoa(tok);
    return 'Basic ' + hash;
}

edited May 16 '14 at 22:58

Sergio Acosta

11,418
12
62
91

answered Apr 19 '12 at 10:44

Royi Namir

144,742
138
468
792

1

Shouldn't it be password instead of pass in the function – Jeffrey Nicholson Carré Sep 10 '13 at 01:41
@Royi Namir, there's an extra space after `Authorization`, which fails setting the header. – Miles Dec 03 '13 at 15:01
why am I getting stack overflow with this solution? :) What could I do wrong? – Anna Leonenko Nov 15 '16 at 23:41

score 3 · Answer 2 · answered Sep 30 '16 at 02:27

As an alternative to beforeSendyou could use the headers property to add the authorization header.

$.ajax({
    type: 'GET',
    url: 'url',
    dataType: 'json',
    headers: {
        "Authorization": make_base_auth(user, password)
    }
    success: function () {});
});

score 1 · Answer 3 · answered Apr 19 '12 at 10:46

1

As pointed in the other answer, you should be using beforeSend function of Jquery Ajax to add authorization header

function setAuthHeader(xhr){
            var creds = username + ':' + password;
            var basicScheme = btoa(creds);
            var hashStr = "Basic "+basicScheme;
            xhr.setRequestHeader('Authorization', hashStr);
    }

  $.get('url',
         beforeSend: setAuthHeader,
        function (data) {


     });

answered Apr 19 '12 at 10:46

Satish

6,457
8
43
63

7

if it was pointed out in the other answer - why not upvote that one instead of adding the same answer ?!?! – Manse Apr 19 '12 at 10:53

Ajax authentication with jQuery

3 Answers3

Linked