Каков наилучший способ поместить аудио-буфер в BLOB-объект, который может воспроизводиться аудиоэлементом?

Question

У меня AudioBuffer хранится как переменная, и я хотел бы, чтобы он воспроизводился элементом Audio. Вот мой текущий неработающий код:

const blob = new Blob(audioBuffer.getChannelData(1), { type: "audio/wav" });
const url = window.URL.createObjectURL(blob);
audioElement.src = url;

Когда я пытаюсь воспроизвести audioElement, я получаю следующую ошибку:

Uncaught (в обещании) DOMException: элемент не имеет поддерживаемых источников .

У кого-нибудь есть идеи, как это решить? Заранее спасибо!

Answer 1

AudioBuffer - это данные PCM, еще не закодированные как WAV. Если вам нужен WAV, вы должны получить библиотеку для кодирования, например https://www.npmjs.com/package/audiobuffer-to-wav

После включения кода выше (вы можете просто скопировать функцию audioBufferToWav и вызываемые ею функции. ниже указателя вне индекса. js).

const blob = new Blob([audioBufferToWav(audioBuffer.getChannelData(1))], { type: "audio/wav" });
const url = window.URL.createObjectURL(blob);
audioElement.src = url;

Ниже вы можете использовать Web Audio API для прямого воспроизведения PCM AudioBuffer.

var myArrayBuffer = audioBuffer;
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var source = audioCtx.createBufferSource();
source.buffer = myArrayBuffer;
source.connect(audioCtx.destination);
source.start();