Question

I’m using jQuery (1.7.0) to make a json/ajax call to Spotify. The following code works fine in Chrome and Firefox, but causes an error (Error: Access is denied.) in IE.

 $.ajax({
     url: 'http://ws.spotify.com/lookup/1/.json',    
     type: 'GET',    
     dataType: 'json',    
     cache: true,    
     data: {    
       uri: "someartist",    
       extras: "album"    
     },    
     success: successfn,    
     error:function(xhr, status, errorThrown) {    
       alert("networking error: "+errorThrown+'\n'+status+'\n'+xhr.statusText);    
     }
 });

The success function is called in Chrome and FF, but the error function is called in IE with the above message. I have set cors to true: jQuery.support.cors = true;.

It works on Chrome and FF both locally and on my server, it works in IE locally but not on the server. Changing cache: false causes problems at the spotify end – doesn’t line additional parameters, so I get a “bad request” error.

Grateful for any pointers.

Thanks

Abo

Answer 1

You are relying on the spotify url to give a Access-Control-Allow-Origin:* in their header to allow cross domain requests from all domains. Internet explorer however doesn’t support this, so it gives access denied.

access-control-allow-origin explained. (TLDR: Servers may allow cross domain ajax in their headers)

If you need this to work in IE, you could use spotify’s JSONP API if they have one or make the AJAX request in flash, which works in all browsers and passes the requests response data to your javascript.