Capturing Microphone Input in the Browser and Streaming to Icecast

To capture audio from the microphone in a browser and stream it to an Icecast server, you can use Web Audio API and a streaming library. Here’s an example using the mic-stream library for simplicity:

Step 1: HTML

Create an HTML file (index.html) with the following content:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Microphone Streaming</title>
</head>
<body>
    <h1>Microphone Streaming</h1>

    <button id="startButton">Start Streaming</button>
    <button id="stopButton" disabled>Stop Streaming</button>

    <script src="mic-stream.min.js"></script>
    <script src="stream.js"></script>
</body>
</html>

Step 2: JavaScript

Create a JavaScript file (stream.js) with the following content:

document.addEventListener('DOMContentLoaded', function () {
    let micStream;

    const startButton = document.getElementById('startButton');
    const stopButton = document.getElementById('stopButton');

    startButton.addEventListener('click', async () => {
        micStream = await navigator.mediaDevices.getUserMedia({ audio: true });

        const icecastUrl = 'http://your-icecast-server:8000/stream1'; // Change to your Icecast server URL

        const icecastStream = new IcecastStream({
            server: icecastUrl,
            stream: '/stream1',
            username: 'source',
            password: 'hackme',
            audioContext: new AudioContext(),
            mediaStream: micStream
        });

        icecastStream.start();

        startButton.disabled = true;
        stopButton.disabled = false;
    });

    stopButton.addEventListener('click', () => {
        micStream.getTracks().forEach(track => track.stop());

        startButton.disabled = false;
        stopButton.disabled = true;
    });
});

Step 3: Include `mic-stream` Library

Download the mic-stream library and include it in the same directory as your HTML file. You can find the libraries:

https://github.com/microphone-stream/microphone-stream

https://github.com/hackergrrl/mic-stream

Step 4: Run Locally

Serve the HTML file using a local development server. You can use Python’s built-in HTTP server for this:

python -m http.server

Visit http://localhost:8000 in your browser.

Notes

Make sure to replace 'http://your-icecast-server:8000/stream1' with the actual URL of your Icecast server and stream.
Adjust the Icecast configuration files to include the mount point /stream1 (as shown in the previous example).
Ensure your Icecast server is configured to accept source connections with the specified username and password.

This is a basic example, and you may need to adapt it based on your specific requirements and Icecast server setup.