Как предоставить доступ к вкладке браузера для передачи аудио

Иван Корнев·29 июля 2026·⏱3 мин

Чтобы передать звуковой поток с конкретной вкладки, необходимо использовать стандартный API navigator.mediaDevices.getDisplayMedia({ audio: true }) и явно подтвердить разрешение в системном диалоге. Без установки специального флажка «Поделиться звуком вкладки» браузер захватит только изображение экрана.

Оглавление

Техническая реализация через API

Для запроса доступа к медиапотоку вкладки используется метод getDisplayMedia. Чтобы захватить не только видео, но и звук, в параметры объекта конфигурации обязательно нужно передать свойство audio: true.

navigator.mediaDevices.getDisplayMedia({ audio: true })
  .then(stream => {
    // Обработка полученного потока
  })
  .catch(err => {
    console.error("Ошибка доступа:", err);
  });

Этот стандарт определен спецификацией W3C для совместного использования экрана. Важно помнить, что браузеры блокируют автоматический захват аудио без явного действия пользователя (user gesture). Запрос должен инициироваться в ответ на клик или другое взаимодействие со страницей.

Используйте вызов getDisplayMedia внутри обработчика событий (например, onclick), чтобы избежать блокировки со стороны браузера из-за политик автозапуска.

Настройки в популярных браузерах

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

БраузерОсобенности предоставления доступа к аудио вкладки
Chrome / EdgeТребует явной установки флажка «Share tab audio» (Поделиться звуком вкладки) в диалоговом окне выбора окна или вкладки.
FirefoxДоступно через API getDisplayMedia при выборе опции «Share audio» в диалоге совместного использования.
Safari (macOS/iOS)Требует явного разрешения пользователя на каждом сеансе совместного использования; автоматический доступ запрещен.

В Google Chrome стабильная поддержка аудио в getDisplayMedia началась с версии 80 (минимальная версия для поддержки — 74+).

Ограничения безопасности

Система защиты браузеров настроена так, чтобы предотвратить скрытую запись звука. При выборе источника демонстрации пользователь видит варианты вроде «Вся вкладка» (Entire tab) или «Аудио вкладки» (Tab audio).

Если галочка для трансляции звука не будет установлена вручную в момент выбора вкладки, аудиопоток передан не будет. Это правило действует независимо от того, какие параметры были переданы в JavaScript-код.

В Safari доступ к аудио вкладки никогда не предоставляется автоматически. Пользователь должен подтверждать разрешение каждый раз при начале новой сессии стриминга или демонстрации экрана.

Частые ошибки

  1. Отсутствие звука при стриминге. Самая распространенная причина — пользователь забыл поставить галочку «Share tab audio» (в Chrome/Edge) или «Share audio» (в Firefox) во всплывающем окне выбора вкладки.
  2. Блокировка запроса скриптом. Вызов getDisplayMedia происходит автоматически при загрузке страницы, а не по клику. Браузеры расценивают это как попытку автозапуска и блокируют доступ.
  3. Игнорирование обновлений в Safari. Пользователи macOS ожидают, что однажды выданное разрешение будет работать всегда, однако Safari требует подтверждения для каждого нового сеанса.

FAQ

Какой метод API используется для захвата звука вкладки? Стандартным методом является navigator.mediaDevices.getDisplayMedia() с параметром { audio: true }.

Почему в Chrome нет звука, хотя код написан верно? Проверьте диалоговое окно выбора вкладки. Там должен быть активен флажок «Поделиться звуком вкладки» (Share tab audio). Без него передается только видеосигнал.

Работает ли автоматическая передача аудио в Safari? Нет. Safari требует явного разрешения пользователя на каждом сеансе совместного использования, полностью запрещая автоматический доступ к аудио вкладки.