XMLHttpRequest gives Invalid state when using Last.fm API

Question

I'm trying to integrate scrobble support into Ubuntu Touch's music app, but I have some difficulty since I can't seem to get the session key working.

In request() I get "Error: Invalid state" on row 53. It seems like last.fms API doesnt answer correctly, nor has the correct state, but I'm new to XMLHttpRequest, so I'm not sure what's the matter.

Code: http://pastebin.com/Aa6DVUA1

Answer 1

You're executing encodeURIComponent with the complete URL instead of the individual query arguments, thus resulting in something like https%3A%2F%2Fws.audioscrobbler.com%2F2.0%2F%3Fmethod%3Dartist.getsimilar%26artist%3DKiss... which is clearly not a valid URL. For an example see here.

Secondly, your usage of XMLHttpRequest is wrong, XHR operates asynchronously but you never define a callback function for your request. Querying xhr.readyState and xhr.status immediately after invoking send() will be executed before the request actually finishes. See here for how to use XHR.

PS: Why not use one of the existing API wrappers for JavaScript, i.e. http://lastfm.felixbruns.de/javascript-last.fm-api/ or at least jQuery to handle the XHR?

PPS: Your authentication request will not work, as you are required to submit the arguments in the post body as opposed to the query string, see this forum post for more information.