I'm learning javascript by trying to build a self-host music library web app.
On frontend I use the audio tag and set the source like this:
<audio id="audio" controls="controls" style="display: none;">
<source src="" id='song' type="audio/mpeg" />
</audio>
const audio = document.getElementById("audio");
audio.src = '/api/song?id=114514';
and backend (using koa) returns a readable stream like this:
router.get('/song', async (ctx, next) => {
console.log("ctx.query:", ctx.query);
let data = await SongModel.findById(ctx.query.id); // find in database
var readerStream = fs.createReadStream(data.url); // create readable stream
ctx.body = readerStream;
});
It works when the frontend and backend are on the same machine or using another PC on the same LAN. However, if I try to access using ios chrome on the same LAN, backend logs:
Error: write EPIPE
at WriteWrap.onWriteComplete [as oncomplete] (node:internal/stream_base_commons:94:16)
I searched and found that it is caused by connection closed before the transmittion completed. But I can't find more information.
How do I fix it? Is it possible to transmit audio using restful api? If not how do I do it then?