如何捕获 HTML5 麦克风输入到 icecast?

How to capture HTML5 microphone input to icecast?

通过HTML5 / Javascript(无闪光灯)捕获麦克风音频流然后将其发送到已设置的 icecast 服务器的步骤和方法是什么?

解决方案必须是单独的 browser/web-based,没有其他软件。 服务器位于 Rails 5.0.0.1.

我应该从哪里开始?

我很难在网上找到任何相关信息,因为所有内容都将 uploading/recording 音频文件视为完整文件,而不是流。

The solution must be solely browser/web-based, no additional software.

目前还不行,因为有. That is, to make an HTTP request either via XHR or Fetch,请求体必须是不可变的。

有新标准ReadableStream which will be available any day now, allowing you to make a ReadableStream (your encoded audio) and PUT it to a server。一旦可用,这就是可能的。

The server is on Rails 5.0.0.1.

不确定你为什么要提到它,因为你说它必须全部存在于浏览器中。无论如何,让我告诉你我是如何使用服务器端代理实现它的。

客户端,您需要使用 getUserMedia(). (Be sure to use adapter.js 捕获音频,因为规范最近发生了变化,您不想手动处理约束对象的变化。)一旦你有了,您可以发送 PCM 样本(我建议首先从 32 位浮点数减少到 16 位有符号),或者您可以使用 AAC 或 MP3 客户端等编解码器。如果您在客户端执行编解码器,您将只能发送一个或两个流。如果您在服务器端执行编解码器,由于 CPU 要求,您可以根据需要导出任意数量的数据,但您将占用更多带宽,具体取决于您导出的流。

对于客户端上的编解码器,您可以使用 MediaRecorder,或通过 emscripten(或类似工具)编译为 JavaScript 的编解码器。 Aurora.js 有一些用于解码的编解码器,但我相信其中至少有一个编解码器也有编码。

要将数据发送到服务器,您需要一个二进制网络套接字。

在服务器端,如果您将编解码器放在那里,FFmpeg 会让这变得很容易。

获得编码后的音频后,您需要向 Icecast 或类似设备发出 HTTP PUT 请求,并在带外更新元数据,或将元数据混合到您正在 PUT 的容器中到服务器。


自我提升:如果您不想自己做所有这些,我有一些您可以从我这里获得许可的代码,称为 AudioPump Web 编码器,它完全可以满足您的要求。您可以根据需要修改它,获取组件并将它们嵌入您的项目等。如果您有兴趣,请给我发电子邮件至 brad@audiopump.co。