How do you call a JSON web service, that requires basic authentication, using jQuery?

Question

I am somewhat novice at javascript, but I am trying to call a JSON web service that require basic authentication using jQuery (or anything that would work really).

I've not been able to come up with any real answers on Google. Is what I am trying to do possible?

Answer 1

You will need to set the appropriate request header to pass the credentials. For example see here.

$.getJSON({
    'url': 'http://host.com/action/',
    'otherSettings': 'othervalues',
    'beforeSend': function(xhr) {
        //May need to use "Authorization" instead
        xhr.setRequestHeader("Authentication",
            "Basic " + encodeBase64(username + ":" + password)
    },
    success: function(result) {
        alert('done');
    }
});

FYI I searched Google for jquery post with basic auth and this was the first link.

Answer 2

Here's the way to do it with jQuery for your copy and pasting needs:

$.ajax({
    url: "/somewhere",
    beforeSend: function(xhr) {
        xhr.setRequestHeader("Authorization", "Basic " + window.btoa(username + ":" + password));
    },
    success: function(result) {
        console.log(arguments);
    }
});