Возможные проблемы и их решения

Не загружается видео или зависает

• Проверьте скорость интернета с помощью Скоростомера .
• Закройте в браузере все вкладки, кроме плеера. Перезагрузите страницу.

Не работает видео с DRM (Widevine) на Android в режиме инкогнито

По информации от Google: с версии Chrome 62 поддержка Widevine отключена в режиме инкогнито на Android. Таким образом, пользователи не потеряют платные лицензии при закрытии вкладок в режиме инкогнито. Подробнее: https://developer.chrome.com/blog/media-updates-in-chrome-62 .

При включённой защите (Widevine DRM) есть возможность записывать видео с экрана

Известны следующие случаи:

• Если один из родительских элементов, куда встраивается плеер, имеет скругления (border-radius). Решение — указать CSS-стили элементу со скруглениями: overflow: initial или overflow: visible.
• Если на странице используются CSS-свойства backdrop-filter, filter — https://issues.chromium.org/issues/362007492 .
• Если <iframe> плеера или родительский элемент использует CSS-свойства aspect-ratio, padding-top.

Не работает Widevine DRM в WebView на Android

В WebView можно проверить поддержку DRM через https://shaka-player-demo.appspot.com/support.html . Если значение null, то поддержка отсутствует.

Возможные решения:

• https://github.com/videojs/video.js/issues/5563 
• https://stackoverflow.com/questions/47626857/how-to-play-widevine-drm-content-in-android-webview 
• https://stackoverflow.com/questions/53143363/how-to-enable-protected-content-in-a-webview 

Не запускается плеер при нажатии на свою кнопку и вызове API play()

Это ограничение браузера: https://developer.chrome.com/blog/autoplay .

Необходимо, чтобы пользователь нажал именно на плеер, а не на вашу кнопку. Чтобы нажатие проходило сквозь ваши элементы на плеер, установите CSS-стиль pointer-events: none на элементы, расположенные поверх плеера.

Ошибка NotAllowedError при вызове методов API

Если текст ошибки содержит “The request is not allowed by the user agent …” или “The request is not triggered by a user activation”, это связано с тем, что вызывается системное API браузера, которое требует предварительного действия пользователя или может запускаться только как прямой результат нажатия или прикосновения.

Подробнее: https://developer.mozilla.org/en-US/docs/Web/Security/User_activation 

Зависает страница с большим количеством плееров

См. раздел Оптимизация.

Не работает полноэкранный режим, когда iframe встроен в iframe

Если родительский <iframe> заполнен не через атрибут src (например, как target формы или содержимое записано напрямую), то атрибут allow может работать некорректно.

Решение: у <iframe> плеера уберите атрибут allow и оставьте только атрибут allowfullscreen.

Не работает автозапуск в Electron

Возможные решения:

• https://github.com/mykle1/MMM-ISS-Live/issues/1 
• https://github.com/apache/cordova-electron/issues/102 

Не работает DRM в Electron

• https://www.electronjs.org/docs/latest/tutorial/testing-widevine-cdm 

Не работает поворот экрана в PWA в полноэкранном режиме

Удалите из manifest.json свойство orientation, чтобы убрать ограничение ориентации для приложения. Затем слушайте событие плеера на изменение полноэкранного режима и управляйте блокировкой поворота:

player.on(player.Events.FullscreenChange, (event) => {
  if (event.data.isFullscreen) {
    screen.orientation.unlock();
  } else {
    screen.orientation.lock('portrait');
  }
});