This issue could be specifically related to Icecast, but I think it's more related to me not understanding how to solve this problem.
I'm running an Icecast server and I want to connect to it via Javascript client that is not on the same host.
It doesn't work. I get the following in the client every time.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://example.com:8000/live. (Reason: CORS request did not succeed). Status code: (null).
In the Icecast config, I have this.
<http-headers>
<header name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
<header name="Access-Control-Allow-Origin" value="*" />
<header name="Access-Control-Allow-Methods" value="GET POST PUT DELETE" />
</http-headers>
If I hit icecast with curl, here are the headers coming back.
< Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept
< Access-Control-Allow-Origin: *
< Access-Control-Allow-Methods: GET POST PUT DELETE
If I take out the Access-Control-Allow-Headers and Access-Control-Allow-Methods, it still doesn't work.
I feel like it should just work with the Access-Control-Allow-Orgin: *.
I've read the other answers on Stackoverflow and read numerous articles about CORS, but I can't figure out what I'm missing.
Looking at Devtools Network for the CORS Failure. I get this. The OPTIONS /live undefined seems like a problem.
OPTIONS /live undefined
Host: radio.example.com:8000
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/119.0
Accept: */*
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: icy-metadata
Referer: http://radio.example.com/
Origin: http://radio.example.com
DNT: 1
Connection: keep-alive
Sec-GPC: 1
The Icecast server works just fine if I access via wget or curl or something that doesn't care about CORS. The browser seems to be expecting something that I'm not currently providing it to satisfy its CORS needs.
I figured out what the issue is. It was the comment by James that sent me down the correct path. The version of Icecast that I'm running (2.4.5 - the current stable version) doesn't support CORS correctly.
I'm triggering an OPTIONS call to Icecast, but this version of Icecast doesn't support OPTIONS. According to the changelog, the beta version 2.5 does support this.
From Icecast, the protocol updates include:
So for now, unless I want to run a beta in production, I'll have to make things work without as many fancy features in the client application I'm building that uses Icecast.
Thank you for the comments, they helped me get to the bottom of this. It was bugging me because it felt like I was doing everything correctly. Diagnosing via the Networking tab in the devtools was critical, and then that lead to the OPTIONS issue.
https://icecast.org/news/icecast-release-2_5-beta3/