如何在网页上录制音频（iOS、Android、PC/Mac） - 无闪存答案

【问题标题】：How to record audio on webpage (iOS, Android, PC/Mac) - no flash如何在网页上录制音频（iOS、Android、PC/Mac） - 无闪存
【发布时间】：2013-11-17 21:19:22
【问题描述】：

我要求允许用户使用他们的麦克风录制音频文件，但它必须在没有闪存的情况下工作，因为它需要在 iOS（移动 safari）、Android 浏览器或 Chrome 以及现代浏览器上运行PC/Mac。

是否有一种干净、简单的 HTML5 方法来录制音频并发布到服务器？我什么都没找到。

【问题讨论】：

我今天正要问这个。我环顾四周，我很确定答案是否定的。它适用于 Chrome 和 Firefox，但 IE 和 Safari 不是骰子。不过，我很想听听最近关于此事的一些想法。
@MattJ。您可以查看以下html5rocks.com/en/tutorials/getusermedia/intro。这也支持移动浏览器，就像您需要的一样。
Akshat，抱歉，我已经看过了。仅支持 Chrome 和 Firefox。文章说 iOS 6+ 应该支持它，但最终被放弃了。文章已过时。
javascript怎么样？
HTML5 捕获 API 还没有实现，所以 flash 是目前唯一的选择。

标签： android ios html audio-recording microphone

【解决方案1】：

您可以使用 HTML5 WebAudio API。

音视频采集介绍Capture audio & video in HTML5

一个很好的库来录制带有样本的音频Recorder.js

使用 Recorder.js How to record audio in Chrome with native HTML5 APIs 的完整且有效的示例

其他 WebAudio API 演示 HTML5 Web Audio API Demos and Libraries

支持的浏览器Can I use Web Audio API?

关于将数据发送到其他服务器，使用 Recorder.js 可以获得音频缓冲区，然后您可以使用 XMLHttpRequest 将 arraybuffer 或 blob 直接发布到目标服务器或编码为 base64。

MDN：Sending and Receiving Binary Data

Html5Rocks：New trick ins XMLHttpRequest2, sending data

【讨论】：

不好。这个问题专门询问了iOS。 Web API 录制在 Safari 下是不行的，Recorder.js 只会产生一条错误消息，指出该 API 不受支持。
我没有在 Safari (iOS) 上测试 Web Audio Api，但显然 6.0-6.1 或更高版本支持该 api，您使用的是什么版本？
@vzamanillo Safari 支持网络音频 api，但不支持访问 mic/input。我刚刚在 OS X 10.10.5 上的 Safari 8 (8.0.8) 中对此进行了测试。（我没有在 iOS 中测试过，但在其他地方读到限制与桌面 Safari 相同）
2016 年中期有任何更新吗？我可以使用 Windows Phone、Android 吗？诺基亚手机有解决方案吗？
这不适用于 iPhone。刚刚在 iOS 10.2 上检查过。最新信息在这里：mobilehtml5.org.

【解决方案2】：

从专业角度来说，我会说不，HTML5 有音频 API，但目前它们的实现因浏览器而异。如果您这样做是为了某种技术演示，那么这可能就足够了，但否则您可能需要回退到其他技术，如闪存和/或本机应用程序以获得更可靠的结果。

【讨论】：

【解决方案3】：

getUserMedia() 现在在移动设备上得到广泛支持：

iOS 11 上的 Safari (except UIWebView)
Android 上的 Chrome

和桌面：

Safari 11
铬
火狐
边缘 12
歌剧

一旦获得网络摄像头/麦克风权限并且麦克风数据启动，您就可以：

使用诸如Recorder.js (wav)、WebAudioRecorder.js (wav,mp3,Vorbis) 或vmsg (mp3) 等JS 库对声音进行编码。
或使用（本机）Media Recorder API 捕获 .ogg (Firefox) 和 .webm (Chrome) 文件中的 Opus 音频以及用于生成 .wav 文件的 Safari 11 和 Edge 的 neat polyfill。

这是我制作的一个演示（live demo，source on GitHub），它使用 Matt Diamond 的Recorder.js 录制在 iOS 11 上的 Safari 中运行的音频（.wav 文件中的 pcm）。单击录制会提示用户允许麦克风访问：

【讨论】：