node.js - How to livestream a music file to <audio> tags from a nodejs stream?

Question

I am developing an internet radio web application, and I want users to live stream audio files. My approach is to create a readable stream from a music file and write to the res object as below.

On the server:

function delay(millis) {
    return new Promise(function(resolve) {
        setTimeout(resolve, millis);
    });
}


const express = require('express');

(async function() {

    const app = express();

    const writables = [];
    const readableStream = fs.createReadStream('music.mp3');

    readableStream.on('data', async function(chunk) {
        await delay(2711); // arbitrary delay
        writables.forEach(function(writable) {
            writable.write(chunk);
        });
    });

    app.get('/stream', async function(req, res) {
        writables.push(res);
    }

    await app.listen(8080);

})();

On the browser:

<audio src="http://localhost:8080/stream" autoplay></audio>

When I tested, it didn't work. I started digging into the problem, then I found out that the problem was that, as long as the data sent to the browser didn't include the first chunk, it won't play at all. Probably it's because the file chunks are not independent or something.

How can I read the chunks from the file such that they are independently playable?

Answer 1

等待大神答复