Question

我需要从1个客户端到服务器到多个侦听器客户端的实时实时音频流。

目前我从客户端进行录音工作，并通过socket.io将音频流传输到服务器。服务器接收此数据，并且必须将音频（也通过socket.io？）传输到想要侦听此流的客户端。它必须尽可能实时（最小化延迟）。

我使用GetUserMedia来录制麦克风（此处浏览器兼容性并不重要）。我希望客户端使用HTML5音频标签来收听流。在服务器上接收的数据是打包在带有audio / wav类型的blob中的块（当前由700打包）。

这是我将代码发送到服务器的代码：

mediaRecorder.ondataavailable = function(e) {
    this.chunks.push(e.data);
    if (this.chunks.length >= 700)
    {
        this.sendData(this.chunks);
        this.chunks = [];
    }
};
mediaRecorder.sendData = function(buffer) {
    blob = new Blob(buffer, { 'type' : 'audio/wav' });
    socket.emit('voice', blob);
}

在服务器上，我能够以相同的方式将块发送到客户端：

socket.on('voice', function(blob) {
    socket.broadcast.emit('voice', blob);
});

在客户端我可以这样玩：

var audio = document.createElement('audio');
socket.on('voice', function(arrayBuffer) {
    var blob = new Blob([arrayBuffer], { 'type' : 'audio/wav' });
    audio.src = window.URL.createObjectURL(blob);
    audio.play();
});

这适用于我发送的第一个blob块，但您不允许继续更改为audio.src到新的URL源，因此这不是一个有效的解决方案。

我想我必须在服务器上创建某种流，我可以在听力客户端上放入HTML5的音频标签，但我不知道如何。接收到的带有块的blob应该实时附加到此流。

这样做的最佳方法是什么？我是从客户端麦克风到服务器吗？

Answer 1

我在这里参加派对有点晚了但是看起来网络音频API将成为你的朋友，如果你还没有完成它。它允许您直接将音频流播放到输出设备，而无需将其附加到音频元素上。

我正在考虑做同样的事情，你的问题已经回答了我的问题 - 如何从客户端获取数据到服务器。 Web音频API的好处是能够将流一起添加并在服务器上为其应用音频效果。

MDN Web Audio API

io事件应替换音频上下文中音频缓冲区对象中的数据。音频处理可以在nodeJS Web音频上下文中发生，然后作为单个流发送到每个客户端。

Answer 2

您可以动态更改audio src，如下所示（假设为mp3类型）：

<audio id="audio" controls="controls">
    <source id="mp3Source" type="audio/mp3"></source>
        Your browser does not support the audio format.
</audio>

每当收到套接字事件时调用以下函数：

function updateSource() { 
        var audio = document.getElementById('audio');

        var source = document.getElementById('mp3Source');
        source.src= <blob>;

        audio.load(); //call this to just preload the audio without playing
        audio.play(); //call this to play the song right away
    }

从NodeJS服务器获取实时流式音频到客户端

2 个答案: