Как визуализировать звук из синтезатора в буфер (массив значений PCM) с Web Audio API

Question

У меня есть простой синтезатор, который играет ноту в течение некоторого промежутка времени:

// 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.

Спасибо!

Answer 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 
}) 

(я не уверен, что все браузеры поддерживают обещание от автономного контекста. Если нет, то используйте offlineCtx.oncomplete, чтобы получить данные см. Спецификация .)

Answer 2

В конце концов я нашел ответ здесь: http://www.pp4s.co.uk/main/tu-sms-audio-recording.html#co-tu-sms-audio-recording__js, но вам это не понравится. По-видимому, Audio API не достаточно стандартизирован для работы во всех браузерах. Таким образом, я смог запустить код в Firefox, но не Chrome.

Основные идеи:

• использование Dest = ас. createMediaStreamDestination(); для получения адресата звука
• новый MediaRecorder (dest.stream); получить рекордер
• использовать MediaRecorder ondataavailable и stop события, чтобы получить данные и объединить его в Blob