Ajax authentication issues

FlightAware AeroAPI
1

Hi I am having major problems returning data using the following ajax call

                    $.ajax({
                        url: 'http://flightxml.flightaware.com/json/FlightXML2/GetLastTrack',
                        type: 'GET',

                        data: { 'ident': '<MYREGHERE>', 'howMany': 10, 'offset': 0 },
                        username: '<MYUSERNAMEHERE>',
                        password: '<MYAPICODEHERE>',

                        success: function (result) {
                         debugger
                        },
                        error: function (data, text) { 
                            debugger;
                        },
                        dataType: 'jsonp',
                        jsonp: 'jsonp_callback',
                        xhrFields: { withCredentials: true }
                    });

even when it does succeed i am getting a popup telling me that this connection is not private and asks me to input the username and password. What am i doing wrong to implement the auth in the ajax. I am aware that chrome wont accept this in this way due to changes some time ago but i have tried other ways such as using

 beforeSend: function (xhr){ 
        xhr.setRequestHeader('Authorization', "Basic " + btoa(uName+":"+passwrd)); 
    },

and also tried using

  headers: {
        "Authorization": "Basic " + btoa(uName+":"+passwrd);
    }

but all with the same result.

Can you please tell me how I use the auth correctly in the ajax to return the data please.

thanks

2

The beforeSend calback should be included within within ajax() method. However, successful authentication will likely result in a Cross-Origin Request error if being performed in browser.