在Ajax JSON脚本中添加基本的HTTP授权

Question

Not really sure how to add authentication in an ajax call for JSON information. I am trying to follow the examples given http://domainapi.com/documentation/how-to-use-domainapi/servuces-provided/domain-availability-api.html to check the availability of a domain name, however it keeps doing a http form pop up asking for username and password.

I thought I had everything right in my code:

function domainAvailabilityCheck(domain) {
    $.ajax({
        type: 'GET',
        url: 'http://api.domainapi.com/v1/availability/'+domain+'.com',
        beforeSend: setHeader,
        success: function(spitback) {
            console.log(spitback.content.domainList.status);
        },
        dataType:'jsonp'
    });
}

var setHeader = function(xhr) {
    xhr.setRequestHeader('Authorization', 'Basic YWtpcmF0ZXN0OmR0d3N0ZXN0');
}

Not sure what it is that I am doing wrong.

Answer 1

Your beforeSend isn't allowing Jquery to pass in the xhr object for the header modifications. The line should be

beforeSend: function(xhr) { xhr.setRequest(......); } // all-in-one, no extra function needed

or

beforeSend: function(xhr) { setHeader(xhr); } // call your separate function

Answer 2

you may also:

var setHeader = function (xhr) {
    xhr.setRequestHeader('Authorization', 'Basic YWtpcmF0ZXN0OmR0d3N0ZXN0');
}

function domainAvailabilityCheck(domain) {
    $.ajax({
        type: 'GET',
        url: 'http://api.domainapi.com/v1/availability/'+domain+'.com',
        beforeSend: setHeader,
        success: function(spitback) {
            console.log(spitback.content.domainList.status);
        },
        dataType:'jsonp'
    });
}

actually it doesn't matter where to put the variable setHeader which holds the anonymous function, but this way up it's more readable (for me and my soft-compiler ... ;)