Detecting EME And CDM Support In A Browser

Last updated on June 6, 2016 - Back to blog home page

Introduction

In this blog post we will review how to detect Encrypted Media Extensions (EME) and Content Decryption Module (CDM) support in a browser for various DRM technologies when streaming with DASH.

It is assumed you have a fair understanding of JavaScript, DASH, EME and DRM in order to process the information present on this page. A good introduction to EME can be found here.

Detecting EME and requestMediaKeySystemAccess support

In order to decrypt a DRM encrypted DASH stream we first need to test for EME support in the browser. No EME support means no DRM decryption. JavaScript snippet (function):

var hasEMESupport = function() {
  var eme = "MediaKeys" in window || "WebKitMediaKeys" in window || "MSMediaKeys" in window;
  if (eme) {
    return true;
  }
  return false;
};

Having EME support in a browser is not enough to play DASH DRM encrypted content. The browser needs a CDM to decrypt a given DRM. A CDM is specific to a DRM technology. The CDM is built within the browser.

Using the requestMediaKeySystemAccess method from a browser navigator object, we can detect if a specific CDM is supported within a browser.

As of June 2016 requestMediaKeySystemAccess is supported in:

• Latest Chrome
• MS Edge
• Latest Firefox and Opera

JavaScript snippet (function) to detect requestMediaKeySystemAccess method availability:

var hasRMKSASupport = function() {    
  var requestMediaKeySystemAccess = "requestMediaKeySystemAccess" in window.navigator;
  if (requestMediaKeySystemAccess) {
    return true;
  }
  return false;
}

Detecting specific DRM/CDM support

Here is a list of supported CDM as of June 2016 for major browsers on the market:

• Widevine CDM: Chrome 34+, Opera 31+, Firefox 47+
• Playready CDM: IE11 on Windows 8+, MS Edge
• Clear Key CDM: latest Chrome and Firefox

Firefox and some other browsers may also support Adobe Primetime DRM but Widevine DRM is most commonly used.

JavaScript snippet to detect specific DRM support - you need to couple it with the hasEMESupport and hasRMKSASupport previously mentioned functions:

var config = [{
  "initDataTypes": ["cenc"],
  "audioCapabilities": [{
    "contentType": "audio/mp4;codecs=\"mp4a.40.2\""
  }],
  "videoCapabilities": [{
    "contentType": "video/mp4;codecs=\"avc1.42E01E\""
  }]
}];
try {
  navigator.
  requestMediaKeySystemAccess("com.widevine.alpha", config).
  then(function(mediaKeySystemAccess) {
    console.log('widevine support ok');
  }).catch(function(e) {
    console.log('no widevine support');
    console.log(e);
  });
} catch (e) {
  console.log('no widevine support');
  console.log(e);
}
try {
  navigator.
  requestMediaKeySystemAccess("com.microsoft.playready", config).
  then(function(mediaKeySystemAccess) {
    console.log('playready support ok');
  }).catch(function(e) {
    console.log('no playready support');
    console.log(e);
  });
} catch (e) {
    console.log('no playready support');
  console.log(e);
}
try {
  navigator.
  requestMediaKeySystemAccess("org.w3.clearkey",config).
  then(function(mediaKeySystemAccess) {
    console.log('clearkey support ok');
  }).catch(function(e) {
    console.log('no clearkey support');
    console.log(e);
  });
} catch (e) {
  console.log('no clearkey support');
  console.log(e);
}