No response from jQuery ajax call

Question

I've been struggling with this for way too long tonight, and I haven't found anything useful when searching for answers. It's probably very simple.

I'm trying to load data using the Spotify Metadata API by doing AJAX calls with jQuery. Running this request in a browser works just fine: http://ws.spotify.com/search/1/track?q=foo But when I try to load the same request using jQuery I get nothing in response. I've tried different contentTypes and dataTypes, but I can't figure out what's wrong!

The code is quite simple:

$.ajax({ 
    url: "http://ws.spotify.com/search/1/track",
    data: "q=foo",
    success: function(xml){
        // do stuff...
    },
    contentType: "application/xml",
    dataType: "xml"
});

If I save the XML returned when running the query in the browser, and loading that file as the url-parameter in the $.ajax-request, everything works just fine, so I guess it has something to do with the format.

The documentation for the Spotify Metadata API might be useful, but I can't figure out what I could be doing wrong.

Answer 1

You cannot make a cross domain ajax call (in most browsers). Since the spotify api end point does not yet support jsonp then you will have to make a server side proxy which will feed the xml back to your page.

Answer 2

I think you're running into limitations in XMLHTTPRequest that prevent XSS requests. More documentation available here: http://www.simple-talk.com/dotnet/asp.net/calling-cross-domain-web-services-in-ajax/. There are a number of work arounds listed.