Widevine quick sample

The below sample uses shaka player to play encrypted content.

• Uses shaka player from Google hosted libraries
• Change the variables marked with ADAPT to make it work
• More info about shaka API at their docs page
• List of all Shaka errors.

index.html

<!doctype html>
<html>
  <head>
    <!-- Shaka Player compiled library: -->
    <script src="https://ajax.googleapis.com/ajax/libs/shaka-player/3.1.0/shaka-player.compiled.js"></script>
    <!-- Your application source: -->
    <script src="myapp.js"></script>
  </head>
  <body>
    <video id="video" width="640" controls autoplay></video>
  </body>
</html>

myapp.js

const manifestUri = '___ADAPT__';

function initApp() {
  // Install built-in polyfills to patch browser incompatibilities.
  shaka.polyfill.installAll();

  // Check to see if the browser supports the basic APIs Shaka needs.
  if (shaka.Player.isBrowserSupported()) {
    // Everything looks good!
    initPlayer();
  } else {
    // This browser does not have the minimum set of APIs we need.
    console.error('Browser not supported!');
  }
}

async function initPlayer() {
  // Create a Player instance.
  const video = document.getElementById('video');
  const player = new shaka.Player(video);

  // Attach player to the window to make it easy to access in the JS console.
  window.player = player;

  // Listen for error events.
  player.addEventListener('error', onErrorEvent);

  // drm configuration
  player.configure({
    drm: {
      servers: {
        'com.widevine.alpha': '_____ADAPT___',
      },
    },
  });

  // Try to load a manifest.
  // This is an asynchronous process.
  try {
    await player.load(manifestUri);
    // This runs if the asynchronous load is successful.
    console.log('The video has now been loaded!');
  } catch (e) {
    // onError is executed if the asynchronous load fails.
    onError(e);
  }
}

function onErrorEvent(event) {
  // Extract the shaka.util.Error object from the event.
  onError(event.detail);
}

function onError(error) {
  // Log the error.
  console.error('Error code', error.code, 'object', error);
}

document.addEventListener('DOMContentLoaded', initApp);