Основные понятия API Web Audio

В этой статье объясняются некоторые теоретические основы аудио, лежащие в основе работы функций API Web Audio, чтобы помочь вам принимать обоснованные решения при проектировании маршрутизации аудио в вашем приложении. Если вы не являетесь звукоинженером, эта статья предоставит вам достаточно информации для понимания того, почему API Web Audio работает именно так, как работает.

API Web Audio подразумевает обработку аудиоопераций внутри аудиоконтекста и разработан для поддержки модульной маршрутизации. Каждый аудиоузел выполняет базовую аудиооперацию и связан с одним или несколькими другими аудиоузлами, образуя график маршрутизации аудио. Поддерживаются несколько источников с различной компоновкой каналов, даже внутри одного контекста. Эта модульная структура обеспечивает гибкость для создания сложных аудиофункций с динамическими эффектами.

Аудиоузлы связаны через свои входные и выходные данные, образуя цепочку, которая начинается с одного или нескольких источников, проходит через один или несколько узлов и заканчивается в пункте назначения (хотя вам не нужно указывать пункт назначения, если вы хотите только визуализировать некоторые аудиоданные). Типичный рабочий процесс работы с веб-аудио выглядит примерно так:

1. Создайте контекст аудио.
2. Создайте аудиоисточники внутри контекста (такие как <audio>, генератор колебаний или поток).
3. Создайте аудиоэффекты (например, узлы реверберации, биквадратного фильтра, панера или компрессора).
4. Выберите конечный пункт назначения для аудио (например, динамики компьютера пользователя).
5. Подключите узлы источника к нулю или более узлам эффектов, а затем к выбранному пункту назначения.

Каждый вход или выход состоит из одного или нескольких аудиоканалов, которые вместе представляют определённую структуру аудио. Поддерживается любая дискретная структура каналов, включая моно, стерео, квадро, 5.1 и так далее.

Есть несколько способов получить аудио:

• Звук может быть сгенерирован непосредственно в JavaScript с помощью аудиоузла (например, генератора колебаний).
• Он может быть создан из исходных данных PCM (например, файлы .WAV или другие форматы, поддерживаемые decodeAudioData()).
• Он может быть сгенерирован из HTML-медиаэлементов, таких как <video> или <audio>.
• Он может быть получен из потока WebRTC MediaStream, такого как веб-камера или микрофон.

При обработке аудиосигнала происходит выборка. Выборка — это преобразование непрерывного сигнала в дискретный сигнал. Другими словами, непрерывная звуковая волна, например, выступление группы, преобразуется в последовательность цифровых выборок (дискретный сигнал во времени), что позволяет компьютеру обрабатывать звук отдельными блоками.

Дополнительную информацию можно найти на странице Википедии Выборка (обработка сигналов).

Аудиобуфер AudioBuffer определяется тремя параметрами:

• количество каналов (1 для моно, 2 для стерео и т. д.),
• его длина, то есть количество кадров образцов внутри буфера,
• и частота дискретизации, количество кадров образцов за секунду.

Образец — это единственное 32-битное значение с плавающей точкой, представляющее значение аудиопотока в определённый момент времени в определённом канале (левый или правый, если речь идёт о стерео). Кадр или кадр образца — это набор всех значений для всех каналов, которые будут воспроизводиться в определённый момент времени: все образцы всех каналов, воспроизводимые одновременно (два для стереозвука, шесть для 5.1 и т. д.).

Частота дискретизации — это количество образцов (или кадров, так как все образцы кадра воспроизводятся одновременно), которые будут воспроизводиться в секунду, измеряется в Гц. Чем выше частота дискретизации, тем лучше качество звука.

Рассмотрим моно- и стерео аудиобуфер, каждый длиной в одну секунду с частотой 44100 Гц:

• Буфер моно будет содержать 44 100 образцов и 44 100 кадров. Свойство length будет равно 44 100.
• Буфер стерео будет содержать 88 200 образцов, но всё ещё 44 100 кадров. Свойство length по-прежнему будет равно 44100, поскольку оно равно числу кадров.

Когда буфер воспроизводится, вы сначала услышите левый кадр образца, затем тот, что рядом с ним, затем следующий и так далее, до конца буфера. В случае стерео вы услышите оба канала одновременно. Кадры образцов удобны, поскольку они не зависят от количества каналов и представляют время идеальным способом для точной манипуляции аудио.

Вот несколько простых примеров:

const context = new AudioContext();
const buffer = new AudioBuffer(context, {
  numberOfChannels: 2,
  length: 22050,
  sampleRate: 44100,
});

Если вы используете вызов выше, вы получите стерео буфер с двумя каналами, который, при воспроизведении на AudioContext, работающем с частотой 44100 Гц (очень распространённое значение, большинство обычных звуковых карт работают с этой частотой), будет воспроизводиться в течение 0,5 секунд: 22 050 кадров/44 100 Гц = 0,5 секунды.

const context = new AudioContext();
const buffer = new AudioBuffer(context, {
  numberOfChannels: 1,
  length: 22050,
  sampleRate: 22050,
});

Если вы используете этот вызов, вы получите моно буфер (буфер с одним каналом), который, при воспроизведении на AudioContext, работающем с частотой 44 100 Гц, будет автоматически передискретизирован до 44 100 Гц (и, следовательно, даст 44 100 кадров) и длиться 1 секунду: 44 100 кадров/44 100 Гц = 1 секунда.

API Web Audio использует формат планарного буфера. Левый и правый каналы хранятся следующим образом:

LLLLLLLLLLLLLLLLRRRRRRRRRRRRRRRR (for a buffer of 16 frames)

Эта структура широко используется в обработке аудио, что упрощает обработку каждого канала независимо.

Альтернативой является использование формата интерлированного буфера:

LRLRLRLRLRLRLRLRLRLRLRLRLRLRLRLR (for a buffer of 16 frames)

Этот формат широко используется для хранения и воспроизведения аудио без значительной обработки, например, файлы .WAV или декодированный поток MP3.

Поскольку API Web Audio предназначен для обработки, он предоставляет только планарные буферы. Он использует планарный формат, но преобразует аудио в интерлированный формат, когда отправляет его на звуковую карту для воспроизведения. Обратно, когда API декодирует MP3, он начинает с интерлированного формата и преобразует его в планарный для обработки.

Каждый аудиобуфер может содержать разное количество каналов. Большинство современных аудиоустройств используют базовые настройки моно (только один канал) и стерео (левый и правый каналы). Некоторые более сложные наборы поддерживают настройки звука объемного звука (например, квадро и 5.1), что может привести к более богатому звуковому опыту благодаря большому количеству каналов. Обычно мы представляем каналы с помощью стандартных сокращений, представленных в таблице ниже:

Когда количество каналов входного и выходного сигналов не совпадает, необходимо выполнить апмиксинг или даунмиксинг. Следующие правила, управляемые настройкой свойства AudioNode.channelInterpretation на speakers или discrete, применяются:

В общем случае, мы получаем выходной сигнал во времени для создания визуализаций звука, обычно считывая данные о его усилении или частоте. Затем, используя графический инструмент, мы преобразуем полученные данные в визуальное представление, такое как график. В API Web Audio доступен анализатор AnalyserNode, который не изменяет аудиосигнал, проходящий через него. Кроме того, он выводит аудиоданные, позволяя обрабатывать их с помощью технологии, такой как <canvas>.

Вы можете получить данные, используя следующие методы:

AnalyserNode.getFloatFrequencyData()

Копирует текущие данные частоты в массив Float32Array, переданный в него.

AnalyserNode.getByteFrequencyData()

Копирует текущие данные частоты в массив Uint8Array (массив беззнаковых байтов), переданный в него.

AnalyserNode.getFloatTimeDomainData()

Копирует текущие данные волны или данных во временной области в массив Float32Array, переданный в него.

AnalyserNode.getByteTimeDomainData()

Копирует текущие данные волны или данные во временной области в массив Uint8Array (массив беззнаковых байтов), переданный в него.

Стереоэффекты позволяют моделировать положение и поведение аудиосигнала в определённой точке физического пространства, имитируя восприятие звука слушателем. В API Web Audio стереоэффекты обрабатываются узлом PannerNode и AudioListener.

Узел использует правую декартову систему координат для описания положения источника звука как вектора и его ориентации как 3D конуса направления. Конус может быть довольно широким, например, для оминиканальных источников.

Аналогично, API Web Audio описывает слушателя, используя правую декартову систему координат: его положение как вектор и его ориентацию как два вектора направления, вверх и вперёд. Эти векторы определяют направление вершины головы слушателя и направление, в котором смотрит нос слушателя. Векторы перпендикулярны друг другу.

В аудиотерминах, фан-ин описывает процесс, с помощью которого ChannelMergerNode принимает ряд моно входных источников и выдает один многоканальный сигнал:

Фан-аут описывает обратный процесс, при котором ChannelSplitterNode принимает многоканальный входной источник и выдает несколько моно выходных сигналов: