Icecast User Auth and Web Audio API

Question

I run an Icecast2 server where the streams are available from my website using the Web Audio API. I am wanting to set up private streams using Icecast User Basic Auth. Acessing these streams can be done using: http://Username:[email protected]/stream.

The problem I am facing is that I want to pass the URL to WEB Audio API as http://example.com/stream and Authenticate using XMLHTTPRequest, if that's possible; however, the request is failing CORS preflight and I am not sure if I am correctly setting my headers.

As a note, I have also tried supplying the URL with the username and password without using any requests and get the message: The HTMLMediaElement passed to createMediaElementSource has a cross-origin resource, the node will output silence. So I guess I need to send a request regardless.

I am currently testing this on my local network. The Icecast server is running on linux and the webpage I am testing is running on windows using IIS. Icecast ip is 192.168.1.30:6048 and IIS is on 127.0.0.1:80

Below is the relavent parts of my Icecast config file and the XMLHTTPRequest I am using. I also currently in my testing have global headers turned off in the Icecast config:

<mount>
    <mount-name>/test-stream.ogg</mount-name>
    <authentication type="htpasswd">
        <option name="filename" value="/usr/share/icecast2/user_auth"/>
        <option name="allow_duplicate_users" value="0"/>
    </authentication>
    <http-headers>
        <header name="Access-Control-Allow-Credentials" value="true" />
        <header name="Access-Control-Allow-Origin" value="http://127.0.0.1" />
        <header name="Access-Control-Allow-Headers" value="Authorization" />
        <header name="Access-Control-Allow-Methods" value="GET, OPTIONS" />
    </http-headers>
</mount>

window.onload = function() {
    let username = "User1";
    let password = "Pass1";

    let xhr = new XMLHttpRequest();
    xhr.open('GET', 'http://192.168.1.30:6048/test-stream.ogg', true);
    xhr.withCredentials = true;
    xhr.setRequestHeader('Origin','http://127.0.0.1');
    xhr.setRequestHeader ("Authorization", "Basic " + btoa(username + ":" + password));
                
    xhr.onload = function() {
        // Do Stuff...
    }
    xhr.send(null);
}

Answer 1

After a bunch of messing around with settings and even further research I found that there appears to be some unspecified issues with trying to use Icecast authentification on webservers that are on localhost.

I was able to solve the problem by moving everything to public servers and adding SSL to Icecast.