# Звук в браузере

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

WEB развивался стремительно, очень скоро там появились картинки, а позже еще и GIF. Стало понятно, что через какое-то время мультимедиа неизбежно проникнет в веб. Флеш-плеер быстро набрал обороты, а позже появился и стандарт html5 с поддержкой аудио и видео.

На первых порах можно было воровать и убивать. Открываешь сайт, у тебя сразу начинает играть что-нибудь. Музыкальный фон для сайта, или видео приветствие - вот это всё. Конечно же, многие начали этим злоупотреблять. Как можно не воспользоваться возможностью в картиночный баннер видео игры засунуть аудио ряд с выстрелами пулеметов? Пока пользователь пытается выкрутить в ноль громкость своих Genius-ов, игра уже прорекламирована.

Первым с этим что-то начали делать Apple. В своем новом браузере Safari они сразу запретили флеш-плеер, а видео и аудио можно было воспроизводить только в отдельном окне на весь экран.

Хром и Фаерфорс прошли более тернистый путь. Поначалу они внедрили понятие "User Interaction", которое означало "активное пользовательское действие". Вы могли запустить видео в браузере только если запуск происходил по клику. С момента клика должно было пройти не больше 1 секунды. Причем если вы запускали видео в таймауте на 1000 миллисекунд или через два таймаута по 500 миллисекунд - все работало. Если делать setTimeout(..., 1001) - видео не запускалось.

У этой схемы нашлось множество минусов:

  • Не понятно, что именно считать активным действиям. Очевидно что скролл нельзя, клик можно. А можно ли брать какой-нибудь touchend? Не понятно
  • Не понятно что делать с запуском нескольких видео в параллель

В итоге Хром и Фаерфокс придумали MEI (Media Engagement Index). Сайту дадут запустить видео со звуком, но только если пользователь хоть раз совершал активное действие на вкладке. Помимо этого у каждого сайта есть "рейтинг просмотра медиа". Если рейтинг высокий - сайт может воспроизводить сколько угодно медиа со звуком. Рейтинг зависит от истории, и посмотреть его можно тут about://media-engagement

Сафари так и не внедрила MEI, у них все еще по умолчанию ни на одном сайте нельзя запустить видео со звуком.

Видео без звука при этом сегодня разрешают все браузеры, даже мобильные. НО только не в режиме энергосбережения. Если ваш мобильный телефон в режиме энергосбережения - без пользовательского действия вы не сможете запустить видео даже без звука.

Под капотом есть еще миллион нюансов, которые нужно знать, но базово - этого достаточно. За последние 5 лет эти политики почти не менялись, и в ближайшие 10 лет вряд ли кардинально поменяются, поэтому достаточно один раз запомнить.


21 августа 2023 г.
📝 All posts