Как разрешить автовоспроизведение видео в киоск-приложении Google Chrome в версии 66 или новее

Начиная с версии 66 Google Chrome, он больше не будет автоматически запускать воспроизведение аудио- и видеофайлов, если громкость воспроизведения не отключена.

Это изменение было внесено, чтобы предотвратить автоматическое воспроизведение на рекламные видеоролики и другие раздражающие элементы веб-страницы. Однако это имеет негативные последствия для ряда вполне допустимых приложений функции автовоспроизведения, например, в приложениях для вывесок.

Новое поведение по умолчанию, не включающее автоматическое воспроизведение видео со звуком, может быть отменено в запуск браузера Google Chrome с параметрами командной строки

- autoplay-policy = no-user-gesture-required

или

- no-user-gesture-required

Новое поведение автозапуска по умолчанию также присутствует в браузере Chrome на ChromeOS (в настоящее время находится в стадии бета-тестирования). Для киоск-приложений, работающих в ChromeOS, нет параметров командной строки, только настройка с использованием файла Manifest.json.

В настоящее время в документации формата Manifest.json нет параметра, позволяющего изменять Политика автозапуска.

Есть ли способ изменить новую политику автоматического воспроизведения Chrome по умолчанию в киоск-приложениях, чтобы разрешить автоматическое воспроизведение видео в приложении на ChromeOS?


Это оказывается, что конечный пользователь должен будет включить автоматическое воспроизведение видео вручную:

  1. при запуске, нажав Ctrl + Alt + S
  2. , войдя в систему
  3. открытие браузера Chrome и ввод: chrome://flags/#autoplay-policy
  4. изменение «политики автозапуска» от «По умолчанию» до «Никаких жестов пользователя не требуется»
  5. нажатие «перезапуска»
  6. перезагрузка устройства

С этого момента автовоспроизведение снова работает в компонентах веб-просмотра, используемых в вашем приложении.

См. эту ветку комментариев по этой теме от Google.


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

  1. Настройки
  2. Дополнительно
  3. Конфиденциальность и безопасность
  4. Настройки сайта
  5. Звук

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

1



Изменения политики автозапуска

Это завершение Chrome Dev Summit 2020 ! Смотрите все сеансы на goo.gle/cds20-sessions прямо сейчас!

Политика автоматического воспроизведения Chrome изменится в апреле 2018 года, и я здесь, чтобы рассказать вам, почему и как это повлияет на воспроизведение видео со звуком. Spoileralert: пользователям это понравится!

Новое поведение

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

Политики автоматического воспроизведения Chrome просты:

  • Приглушенное автовоспроизведение всегда разрешено.
  • Автовоспроизведение со звуком разрешено, если:
    • Пользователь взаимодействовал с доменом (щелкнул, коснулся и т. д. .).
    • На настольном компьютере пороговое значение индекса взаимодействия с медиа пользователя было превышено, что означает, что пользователь ранее воспроизводил видео со звуком.
    • Пользователь добавил сайт на свой домашний экран на мобильном устройстве или установили PWA на рабочем столе.
  • Верхние фреймы могут делегировать разрешение на автовоспроизведение своим фреймам, чтобы разрешить автовоспроизведение со звуком.

Индекс взаимодействия со СМИ (MEI) 3>

MEI измеряет склонность человека к потреблению мультимедиа на сайте. Текущий подход Chrome — это отношение посещений к значимым событиям воспроизведения мультимедиа по источнику:

  • Потребление медиафайлов (аудио/видео) должно быть больше 7 секунд.
  • Аудио должно присутствовать и не отключаться.
  • Вкладка с видео активна.
  • Размер видео (в пикселях) должен быть больше 200×140.

Исходя из этого, Chrome вычисляет показатель взаимодействия с медиа, который является самым высоким на сайтах, на которых воспроизводится мультимедиа. на регулярной основе. Когда он достаточно высок, воспроизведение мультимедиа разрешается автоматически воспроизводиться только на рабочем столе.

Пользовательский MEI доступен на внутренней странице chrome://media-entertainment .

Параметры разработчика

Как разработчик, вы можете изменить Chrome поведение политики автовоспроизведения локально, чтобы протестировать ваш сайт в зависимости от взаимодействия с пользователем.

  • Вы можете полностью отключить политику автовоспроизведения, используя внутренний переключатель с хромом. exe --autoplay-policy = no-user-gesture-required . Это позволяет вам протестировать ваш веб-сайт, как если бы пользователь был сильно увлечен вашим сайтом, и автоматическое воспроизведение воспроизведения будет всегда разрешено.

  • Вы также можете убедиться, что автовоспроизведение никогда не разрешено, отключив использование MEI, применив политику автовоспроизведения к веб-аудио и получив ли сайты с самым высоким общим MEI автовоспроизведение по умолчанию для новых пользователей. Это можно сделать с помощью трех внутренних переключателей с chrome.exe--disable-features=PreloadMediaEngagementData,MediaEngagementBypassAutoplayPolicies.

Делегирование iframe

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

     

Когда политика функции для автовоспроизведения отключена, вызывает play () без жеста пользователя отклонит обещание с помощью NotAllowedError DOMException. И атрибут autoplay также будет проигнорирован.

Примеры сценариев

Пример 1: Каждый раз, когда пользователь посещает VideoSubscriptionSite.com на своем ноутбуке они смотрят телешоу или фильм. Поскольку их оценка взаимодействия со СМИ высока, автовоспроизведение разрешено.

Пример 2: GlobalNewsSite.com содержит как текст, так и видео. . Большинство пользователей заходят на сайт за текстовым контентом и смотрят видео только изредка. Показатель вовлеченности пользователей в СМИ низкий, поэтому автовоспроизведение не будет разрешено, если пользователь переходит непосредственно со страницы в социальной сети или из поиска.

Пример 3: LocalNewsSite.com имеет как текстовый, так и видеоконтент. Большинство людей заходят на сайт через домашнюю страницу, а затем нажимают на статьи новостей. Автовоспроизведение на страницах новостной статьи будет разрешено из-за взаимодействия пользователя с доменом. Однако следует позаботиться о том, чтобы пользователи не удивились автоматическому воспроизведению содержимого.

Пример 4: MyMovieReviewBlog.com встраивает iframe с movietrailer, чтобы сопровождать их обзор. Пользователь взаимодействовал с доменом, чтобы перейти к конкретному блогу, поэтому автоматическое воспроизведение разрешено. Однако блогу необходимо явно делегировать эту привилегию iframe, чтобы контент воспроизводился автоматически.

Корпоративные политики Chrome

Это новое поведение автовоспроизведения можно изменить с помощью Корпоративные политики Chrome для таких случаев, как киоски или автоматические системы. Ознакомьтесь со страницей справки «Список политик», чтобы узнать, как установить эти новые политики автоматического воспроизведения для предприятий:

  • Политика «AutoplayAllowed» определяет, разрешено ли автоматическое воспроизведение или нет.
  • Политика «AutoplayWhitelist» позволяет указать белый список шаблонов URL-адресов, в котором автоматическое воспроизведение всегда будет включено.

Рекомендации для веб-разработчиков

Элементы аудио/видео

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

Вы всегда должны смотреть на обещание, возвращаемое функцией play, чтобы увидеть, было ли оно отклонено:

  var обещание = document.querySelector ('video'). play (); if (обещание! == undefined) {prom.then (_ => {//Автозапуск  началось!}). catch (error => {//Автовоспроизведение было предотвращено.//Показываем кнопку «Воспроизвести», чтобы пользователь мог начать воспроизведение.  });}  

Один из классных способов привлечь пользователей — это использовать отключенное автовоспроизведение и позволить им выбрать включение звука (см. фрагмент кода ниже). Некоторые веб-сайты уже эффективно это делают, в том числе Facebook, Instagram, Twitter и YouTube.

   

Веб-аудио

Во-первых, напомним, что рекомендуется дождаться взаимодействия с пользователем перед запуском воспроизведения звука, поскольку пользователь знает, что что-то происходит. Подумайте, например, о кнопке «воспроизведение» или переключателе «вкл/выкл». Вы также можете просто добавить кнопку «включить звук» в зависимости от потока приложения.

Если вы создадите свой AudioContext при загрузке страницы, вам придется вызвать resume () через некоторое время после того, как пользователь взаимодействовал со страницей (например, пользователь нажал кнопку). В качестве альтернативы, AudioContext будет возобновлен после жеста пользователя, если start () вызывается на любом присоединенном узле.

 //Существующий код без изменений.window.onload = function () {var context = new AudioContext (); //Настраиваем все узлы ...}//Однострочное возобновление воспроизведения, когда пользователь взаимодействует со страницей.document.querySelector ('button'). AddEventListener ('click', function () {context.resume (). Then  (() => {console.log ('Воспроизведение успешно возобновлено');});});  

Вы также можете создать AudioContext только тогда, когда пользователь взаимодействует со страницей.

  document.querySelector ('button'). addEventListener ('click', function () {var context = new AudioContext ()  ;//Настраиваем все узлы ...});  

Чтобы определить, потребуется ли браузеру взаимодействие с пользователем для воспроизведения звука, вы можете проверить состояние из AudioContext после того, как вы его создали. Если вам разрешено играть, он должен немедленно переключиться на запущен . В противном случае он будет приостановлен . Если вы слушаете событие statechange , вы можете обнаруживать изменения асинхронно.

Для информации ознакомьтесь с небольшим запросом на вытягивание, который исправляет воспроизведение веб-аудио из-за этих изменений политики автозапуска для https://airhorner.com.

Была ли эта страница полезной?
Да
Что было лучше всего на этой странице?
Это помогло мне достичь моих целей
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Там была вся необходимая мне информация
Спасибо за отзыв. Если у вас есть конкретные идеи о том, как улучшить эту страницу, создайте проблему.
В нем была точная информация
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Было легко читать
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Что-то еще
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Нет
Что было хуже всего на этой странице?
Это не помогло мне достичь моей цели (целей)
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Отсутствовала нужная мне информация
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
В нем была неточная информация
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Было трудно читать
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Что-то еще
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.

[{«type»: » thumb-down «,» id «:» missingTheInformationINeed «,» label «:» Отсутствует нужная мне информация «}, {» type «:» thumb-down «,» id «:» tooComplicatedTooManySteps «,» label «:» Слишком сложно/слишком много шагов «}, {» type «:» thumb-down «,» id «:» outOfDate «,» label «:» Out of date «}, {» type «:» thumb-down «, «id»: «samplesCodeIssue», «label»: «Примеры/Проблема с кодом»}, {«type»: «thumb-down», «id»: «otherDown», «label»: «Other»}] [{«type»: «thumb-up», «id»: «easyToUnderstand», «label»: «Легко понять»}, {«type»: «thumb-up», » id «: «olvedMyProblem», «label»: «Моя проблема решена»}, {«type»: «thumb-up», «id»: «otherUp», «label»: «Другое»}]

Оцените статью
clickpad.ru
Добавить комментарий