确定浏览器支持的DRM系统

Question

我试图找出如何确定哪个DRM系统浏览器正在使用.事实上,只有chrome说使用'com.widevine.alpha',其中IE&Safari(Win)在'requestMediaKeySystemAccess'上抛出错误,而firefox甚至没有尝试说它使用'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;
}

是否有任何解决方案,如Modernizr或类似的解决方案,我应该使用哪个keySystem？

Answer 1

有几个网站提供这样的检查,比如dash-player.com/browser-capabilities/在仔细研究它是如何完成之后,可以使用类似的东西:

// EME Check
var keySystems = {
  widevine: ['com.widevine.alpha'],
  playready: ['com.microsoft.playready', 'com.youtube.playready'],
  clearkey: ['webkit-org.w3.clearkey', 'org.w3.clearkey'],
  primetime: ['com.adobe.primetime', 'com.adobe.access'],
  fairplay: ['com.apple.fairplay']
};
var keySystemsCount = (function () {
  var count = 0;
  for (keysys in keySystems) {
    if (keySystems.hasOwnProperty(keysys)) {
      count += keySystems[keysys].length;
    }
  }
  return count;
})();

var testVideoElement = document.createElement('video');
var supportedSystems = [];
var unsupportedSystems = [];

var supportsEncryptedMediaExtension = function () {
  if (!testVideoElement.mediaKeys) {
    if (window.navigator.requestMediaKeySystemAccess) {
      if (typeof window.navigator.requestMediaKeySystemAccess === 'function') {
        console.log('found default EME');
        hasEME = true;
        var isKeySystemSupported = function (keySystem) {
          var config = [{initDataTypes: ['cenc']}];
          if (window.navigator.requestMediaKeySystemAccess) {
            window.navigator.requestMediaKeySystemAccess(keySystem, config).then(function (keySystemAccess) {
              supportedSystems.push(keySystem);
            }).catch(function () {
              unsupportedSystems.push(keySystem);
            });
          }
        };
        var keysys, dummy, i;
        for (keysys in keySystems) {
          if (keySystems.hasOwnProperty(keysys)) {
            for (dummy in keySystems[keysys]) {
              isKeySystemSupported(keySystems[keysys][dummy]);
            }
          }
        }
      }
    } else if (window.MSMediaKeys) {
      if (typeof window.MSMediaKeys === 'function') {
        console.log('found MS-EME');
        hasEME = true;
        var keysys, dummy, i;
        for (keysys in keySystems) {
          if (keySystems.hasOwnProperty(keysys)) {
            for (dummy in keySystems[keysys]) {
              if (MSMediaKeys.isTypeSupported(keySystems[keysys][dummy])) {
                supportedSystems.push(keySystems[keysys][dummy]);
              } else {
                unsupportedSystems.push(keySystems[keysys][dummy]);
              }
            }
          }
        }
      }
    } else if (testVideoElement.webkitGenerateKeyRequest) {
      if (typeof testVideoElement.webkitGenerateKeyRequest === 'function') {
        console.log('found WebKit EME');
        hasEME = true;
        var keysys, dummy, i;
        for (keysys in keySystems) {
          if (keySystems.hasOwnProperty(keysys)) {
            for (dummy in keySystems[keysys]) {
              if (testVideoElement.canPlayType('video/mp4', keySystems[keysys][dummy])) {
                supportedSystems.push(keySystems[keysys][dummy]);
              } else {
                unsupportedSystems.push(keySystems[keysys][dummy]);
              }
            }
          }
        }
      }
    } else {
      console.log('no supported EME implementation found');
      hasEME = false;
    }
  }
}

只需运行supportsEncryptedMediaExtension(),supportedSystems就会填充所需的信息.

Answer 2

除了这里列出的信息，我想提一下，在 Chrome 中，您是否使用https都会影响navigator.requestMediaKeySystemAccess功能的可用性。

在这可能是运行在你的开发环境http，navigator.requestMediaKeySystemAccess将恢复undefined为Chrome浏览器而同样的代码将在返回功能的Firefox。

在有你的督促环境https，navigator.requestMediaKeySystemAccess会返回一个功能都在Chrome和Firefox浏览器。

Answer 3

我必须给出videoCapabilities标志才能使这项工作成功。

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+").." );
      }
    }
  }
}