'Determine DRM system supported by browser

I've trying to find out how to determine which DRM system browser is using. And in fact, only chrome say it is use 'com.widevine.alpha' where IE & Safari (Win) throw error on 'requestMediaKeySystemAccess', and firefox do not even try to say it use 'com.adobe.acccess' =]

 function isKeySystemSupported(keySystem) {

    var dfd = Q.defer();
    console.log('check: ', keySystem);
    navigator.requestMediaKeySystemAccess(keySystem, [{contentType: 'video/webm; codecs="vp9"'}]).then(function() {
        dfd.resolve(true);
    }, function() { dfd.resolve(false); } );

    return dfd.promise;
}

is there any solution, like Modernizr or similar to get which keySystem I should use?

htmlhtml5-videodrm


Solution 1:[1]

In addition to the information listed here, I want to mention that in Chrome, whether you are using https or not will affect the availability of navigator.requestMediaKeySystemAccess function.

In your development environment that probably is running on http, navigator.requestMediaKeySystemAccess will return undefined for Chrome whereas the same code will return a function in Firefox.

In your prod environment that has https, navigator.requestMediaKeySystemAccess will return a function both in Chrome and Firefox.

Solution 2:[2]

I had to give videoCapabilities flags to make this work.

function testEME() {
  // https://shaka-player-demo.appspot.com/support.html
  var keySysConfig = [{
    "initDataTypes": ["cenc"]
      //,"persistentState": "required"  // don't use or MacSafari "not supported"
      //,"persistentState": "required", "distinctiveIdentifier": "required"
      //,"audioCapabilities": [{
      //  "contentType": "audio/mp4;codecs=\"mp4a.40.2\""
      //}]
      ,"videoCapabilities": [{
    "contentType": "video/mp4;codecs=\"avc1.4D401E\"" // avc1.42E01E = ConstrainedLevel3, 4D401E=MainLevel3
    //,"robustness": "3000"
      }]
  }];           
        
  var keySystems = {
    playready: ['com.microsoft.playready.recommendation', 'com.microsoft.playready'
      , 'com.microsoft.playready.hardware', 'com.youtube.playready'],
    clearkey: ['webkit-org.w3.clearkey', 'org.w3.clearkey'],
    widevine: ['com.widevine.alpha'],
    primetime: ['com.adobe.primetime', 'com.adobe.access'],
    fairplay: ['com.apple.fairplay','com.apple.fps'
      , 'com.apple.fps.1_0', 'com.apple.fps.2_0', 'com.apple.fps.3_0']
  };
            
  for(keyArr in keySystems) {
    for(forItemIdx in keySystems[keyArr]) {
      let keySys = keySystems[keyArr][forItemIdx];
      try {
         navigator.requestMediaKeySystemAccess(keySys, keySysConfig).
         then(function(mediaKeySystemAccess) {
         //let mkConfig = mediaKeySystemAccess.getConfiguration();
         //let sFlags = "persistentState="+mkConfig.persistentState 
         //  + ", distinctiveIdentifier="+mkConfig.distinctiveIdentifier; 
        console.log(keySys + " supported"); //+" ("+sFlags+")");
      }).catch(function(ex) {
         console.log(keySys+" not supported (" + ex.name+" "+ex.message+")." );
      });
      } catch (ex) {
        console.log(keySys+" not supported (" + ex.name+" "+ex.message+").." );
      }
    }
  }
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Jason Kim
Solution 2 Whome

Related Questions