如何从 AudioContext 获取麦克风数据答案

【问题标题】：How do I get microphone data from AudioContext如何从 AudioContext 获取麦克风数据
【发布时间】：2014-05-21 12:39:37
【问题描述】：

所以，我刚刚发现你可以record sound using javascript。太棒了！

我立即创建了新项目来自己做某事。但是，我一打开示例脚本的源代码，就发现根本没有解释性的cmets。

我开始在谷歌上搜索，发现一个 long and interesting article about AudioContext 根本不知道录音（它只提到了 remixinf 声音）和 MDN article，其中包含所有信息 - 成功隐藏了我想要的那个.

我也知道existing frameworks 处理这件事（不知何故，也许）。但如果我想要一个录音机，我会下载一个 - 但我真的很好奇它是如何工作的。

现在我不仅不熟悉事情的编码部分，而且我也很好奇整个事情将如何运作 - 我是否会在特定时间获得强度？就像在任何示波器中一样？或者我可以对样品进行光谱分析吗？

所以，为了避免任何错误：请问，谁能解释使用上述 API 获取输入数据并最终提供带有解释性 cmets 的代码的最简单和最直接的方法？

【问题讨论】：

欢迎来到记录不充分、支持不充分的 Web Audio API 世界！不幸的是，对于 SO 问题，这并不是一个很好的格式，但我会引导您阅读一篇很好的解释性文章：codeartists.com/post/36746402258/…
WebAudio API 仅用于混合声音。要获取麦克风数据，您想使用navigator.getUserMedia
@RGraham 对不起 - 但是记录不充分的事情不是一个很好的问题吗？我可以阅读有据可查的文档，不是吗？ :) 但是感谢您的链接
@TomášZato 这是一个很好的主题，但是这个问题似乎有点宽泛。你基本上是在问“它是如何工作的，有例子”，这对于一本书来说是一个很好的话题，但对于 Stack Overflow 来说不是......在我看来......
好吧，我没想到它可能会那么复杂。我读过你提到的那篇文章。它使用我已经讨论过的recorder.js - 我更多的是寻找声音可视化的原始数据而不是实际录音。

标签： javascript html audiocontext

【解决方案1】：

如果您只想使用麦克风输入作为 WebAudio API 的源，以下代码对我有用。它基于：https://gist.github.com/jarlg/250decbbc50ce091f79e

navigator.getUserMedia = navigator.getUserMedia
                      || navigator.webkitGetUserMedia
                      || navigator.mozGetUserMedia;
navigator.getUserMedia({video:false,audio:true},callback,console.log);

function callback(stream){
  ctx = new AudioContext();
  mic = ctx.createMediaStreamSource(stream);
  spe = ctx.createAnalyser();
  spe.fftSize = 256;
  bufferLength = spe.frequencyBinCount;
  dataArray = new Uint8Array(bufferLength);
  spe.getByteTimeDomainData(dataArray);
  mic.connect(spe);
  spe.connect(ctx.destination);
  draw();
}

【讨论】：