如何使用 Web Audio API 将音频从合成器渲染到缓冲区（PCM 值数组）答案

【问题标题】：How to render the audio from a synth to a buffer (array of PCM values) with the Web Audio API如何使用 Web Audio API 将音频从合成器渲染到缓冲区（PCM 值数组）
【发布时间】：2016-07-28 22:08:06
【问题描述】：

我有一个简单的合成器，可以播放一段时间的音符：

// Creating audio graph
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var oscillator = audioCtx.createOscillator();
var gainNode = audioCtx.createGain();
oscillator.connect(gainNode);
gainNode.connect(audioCtx.destination);

// Setting parameters
oscillator.type = "sine";
oscillator.frequency.value = 2500;

// Run audio graph
var currentTime = offlineCtx.currentTime;
oscillator.start(currentTime);
oscillator.stop(currentTime + 1);

如何获取合成器发出的声音的 PCM 数据？我已经设法通过使用decodeAudioData 来处理音频样本，但我找不到不基于加载样本的音频图的等价物。

我特别想用OfflineAudioContext 渲染音频图，因为我只关心尽快检索 PCM 数据。

谢谢！

【问题讨论】：

在这里试试我的项目，可以让你记录一定的秒数到一组你可以处理的帧中：stackoverflow.com/questions/37728518/…

标签： javascript audio web-audio-api

【解决方案1】：

您说要使用离线上下文，但实际上并没有使用离线上下文。所以你应该这样做

var offlineCtx = new OfflineAudioContext(nc, length, rate)

其中nc = 通道数，length 是采样数，rate 是您要使用的采样率。

创建你的图表，开始一切，然后做

offlineCtx.startRendering().then(function (buffer) {
  // buffer has the PCM data you want. Save it somewhere, 
  // or whatever
})

（我不确定所有浏览器都支持来自离线上下文的 Promise。如果不支持，请使用 offlineCtx.oncomplete 获取数据。请参阅规范。）

【讨论】：

【解决方案2】：

最终我在这里找到了答案：http://www.pp4s.co.uk/main/tu-sms-audio-recording.html#co-tu-sms-audio-recording__js 但你不会喜欢它。显然，音频 API 的标准化程度还不够高，无法在所有浏览器上运行。所以我已经能够在 Firefox 中运行上面的代码，但不能在 Chrome 中运行。

基本思路：

使用 dest = ac.createMediaStreamDestination(); 获取目的地声音的
使用 new MediaRecorder(dest.stream); 获取记录器
使用 MediaRecorder ondataavailable 和 stop 事件获取数据并将其组合成 Blob

【讨论】：