How to make a non-JSONP cross-domain Ajax call in IE9 and earlier

Question

I want to call the following web service

var url = 'search.php',
    data = {
        addressdetails: 1,
        format: 'json',
        osmtype: 'node',
        q: 'london'
    };

$.ajax('//open.mapquestapi.com/nominatim/v1/' + url, {
    type: 'GET',
    data: data,
    contentType: 'application/json',
    success: function (data, status) {
        var results = [];
        if (status === 'success' && !data.error) {
            console.log('success');
        }
    },
    error: function(jqXHR, textStatus, errorThrown ) {
        console.log('error');
    }
});

I created a JSFiddle with this example: http://jsfiddle.net/JX27m/1

I've been told that IE8+ supports Cross-Origin Resource Sharing (CORS), so there should be a way to tweak this code to make it work on IE9, right?

Cheers, Christophe

Answer 1

Assuming the server in question supports CORS and allows your origin, you can use IE's XDomainRequest object rather than XMLHttpRequest . jQuery doesn't do that for you because the jQuery team feel there are too many problems with the XDR object (details in this ticket , near the bottom), but you can do it yourself, or there are plugins for jQuery that provide that functionality. For instance, this one is linked from that same jQuery ticket.

Answer 2

Check CanIUse.com and you will see IE 8 & 9 have partial support. My guess is because CORS was not actually introduced as CORS in the specification till 2009 (after IE 8 & too late to appear in IE 9). They probably implemented support of Access Control for Cross-Site Requests That eventually became CORS. They seem to support the XDomainRequest Object for cross domain requests. Check the Can I Use resources tab to find some other articles.