XMLHttpRequest failing with status 0 in Spotify app

I’m working on a feature that fetches song lyrics using XMLHttpRequest but running into issues. When I make the API call, the browser inspector shows the request status as 0 instead of a proper HTTP response code.

Here’s my current approach:

const performerName = "Sample Artist";
const trackTitle = "Sample Song";
const apiUrl = `https://musicdata.api/lyrics?performer=${encodeURIComponent(performerName)}&track=${encodeURIComponent(trackTitle)}&format=xml`;

const xhr = new XMLHttpRequest();
xhr.open('GET', apiUrl);
xhr.send();

The request keeps returning status 0 and I can’t figure out why this is happening. Has anyone encountered similar issues when making cross-origin requests? What solutions worked for you?

This happens all the time with third-party APIs in browsers. XMLHttpRequest status 0 usually means the browser’s security policies killed your request. I ran into this exact problem building a web player with lyrics integration. Most lyrics APIs won’t accept requests from random web origins because of licensing issues. Check your browser’s network tab first - see if the request even shows up. Sometimes it gets blocked at the DNS level. Your best bet is setting up a simple middleware service that sits between your frontend and the lyrics API. That’ll skip the client-side restrictions completely.

check if ur using HTTPS - mixed content can trigger status 0 errors. also, that musicdata.api might need an API key in the headers, which could cause a preflight OPTIONS request to fail silently.

Status 0 indicates that your request was blocked before reaching the server, often due to CORS restrictions or network security measures. I faced a similar issue while developing a music application recently. It’s likely that the API you’re trying to access lacks the appropriate CORS headers for client requests from your domain. One solution is to create a server-side proxy to handle the request and relay the data to your frontend. Alternatively, verify if the API offers JSONP support or has documentation specific to browser requests.

Had this exact problem building a playlist analyzer last year. Status 0 means the browser killed your request before it even sent - happens when the target server doesn’t allow your origin. That musicdata.api domain probably doesn’t whitelist Spotify’s app domain in their CORS policy. I’d try switching to fetch API with proper error handling first - you’ll get clearer debugging info. If you still get the same issue, route it through your own backend endpoint that makes the API call server-side and returns data to your frontend. Most lyrics APIs are pretty strict about direct browser access anyway.

yep, status 0 def sounds like a cors issue. many apis block cross-origin requests like that. u might wanna try using a proxy server or do the request on your backend instead of js.