Интеграция drmnow! multi-drm с плеером Hls.js

В данной статье мы расскажем, как правильно использовать “open source” плеер Hls.js для воспроизведения зашифрованного видео при помощи DRM Widevine.

Сайт: https://github.com/video-dev/hls.js, https://hls-js.netlify.app/api-docs/

Поддерживаемые форматы: HLS с Widevine.

Hls.js + Widevine

Ниже мы приведем пример html-страницы для инициализации плеера.

<!DOCTYPE html>

<html>

<body>

  <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>

  <video id="video"></video>

  <script>

    var video = document.getElementById('video');

    if (Hls.isSupported()) {

      var hls = new Hls({

        licenseXhrSetup: function (xhr, url) {

          xhr.withCredentials = true; // do send cookies

          if (!xhr.readyState) {

            // Call open to change the method (default is POST) or modify the url

            xhr.open('POST', url, true);

            // Append headers after opening

            xhr.setRequestHeader('Content-Type', 'application/octet-stream');

          }

        },

        enableWorker: true,

        widevineLicenseUrl: "https://[PROJECT].nowdrm.co/v2/widevine",

        emeEnabled: true

      });

      hls.loadSource('https://myhost.tld/some/folder/master.m3u8');

      hls.attachMedia(video);

      hls.on(Hls.Events.MEDIA_ATTACHED, function () {

        video.muted = true;

        video.play();

      });

    }

  </script>

</body>

</html>

Для параметра hls.loadSource укажите ссылку на hls-плейлист, например, https://myhost.tld/some/folder/master.m3u8). HTTPS-доступ к файлу обязателен.
В поле widevineLicenseUrl укажите адрес сервера проверки лицензий Widevine вида https://[project].nowdrm.co/v2/widevine, где [project] название вашего проекта в личном кабинете cdnnow!

Содержание Menu

Интеграция drmnow! multi-drm с плеером Hls.js

Hls.js + Widevine

Содержание