Solution to CORS error if using XMLHTTPRequest

FlightAware AeroAPI
1

I know why the CORS stuff exists: to prevent Cross-Site-Scripting Attacks, but does anyone have a way of accessing the aeroapi data successfully using XMLHTTRequest. I have tried setRequestHeader but AFAIK the Access-Control-Allow-Origin token is set on the server, not the client.

const xhr = new XMLHttpRequest();
xhr.withCredentials = true;

xhr.addEventListener(‘readystatechange’, function () {
if (this.readyState === this.DONE) {
// THIS IS WHERE THE SERVER REJECTS THE REQUEST
}
});

xhr.open(‘GET’, ‘https://aeroapi.flightaware.com/aeroapi/flights/search?query=-latlong+“61.0+-11.0+50.0+2.0”’, true);
xhr.setRequestHeader(‘x-apikey’, ‘MY_KEY’);

Any help would be hugely appreciated.

2

We don’t recommend attempting to write browser-based (client-side) access to AeroAPI since that will generally imply that you embed your API Key within the control of the browser, making it vulnerable to unintentional misuse.

Our recommended application design is to use a server-hosted layer that allows you to validate inputs and abstract your actions against AeroAPI. This also allows you to perform your own access checking and response caching.

1 Like