Синхронизируйте воспроизведение аудио и видео в Интернете.

API веб-аудио позволяет правильно добиться AV-синхронизации.

François Beaufort

Свойство outputLatency экземпляра AudioContext предоставляет оценку задержки вывода аудиооборудования (например, наушников Bluetooth или внешнего аудиоинтерфейса USB). Это свойство полезно, если вы хотите:

• Синхронизируйте существующий аудиоматериал и вновь записанный материал. (в сценарии музыкального производства)
• Синхронизируйте вывод веб-аудио и других медиафайлов (например, видео или воспроизведения MIDI).

В этой демонстрации WebCodecs ( источник ) API WebCodecs используется для декодирования MediaStream в необработанные видео- и аудиоданные, а затем воспроизводится в HTML-элемент <canvas> с аудиоданными, поступающими из Audio Worklet . Свойство outputLatency позволяет демо-версии определять, когда заданная временная метка звука достигает ушей пользователя, а затем правильно рисовать видеокадры в соответствии с ней.

Попробуйте сами, воспроизведите видео с помощью любимой Bluetooth-гарнитуры (🎧), дождитесь птицы (🐦) (см. выше) и установите флажок (☑️), чтобы наблюдать за изменениями при воспроизведении звука. Общее значение выходной задержки обновляется в режиме реального времени.

Задержка вывода аудиоконтекста

Поддержка браузера

• 102
• 102
• 70
• Икс

Источник

Изображение героя, созданное Вахидом Хене на Unsplash .