Multi-drm 内容的 Dash.js 问题答案

【问题标题】：Dash.js issue with Multi-drm contentMulti-drm 内容的 Dash.js 问题
【发布时间】：2016-09-06 08:28:39
【问题描述】：

我正在尝试使用 dash.js 播放器（版本 2.3.0）播放多 drm 内容（Widewine、Playready）。我收集了尽可能多的信息，但我仍然无法播放内容。 Dash.js 播放器最近修改了，网上找到的很多代码示例已经失效，文档也没有更新。这是我当前的代码：

HTML：

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8" />
   <script src="dash.all.debug.js"></script>
   <link rel="stylesheet" type="text/css" href="css/style.css" />
   <title>Dash Example App</title>
</head>

<body onload="testVideo()">
   <button id="playButton" type="button">Play</button>
   <div>
      <video id="vid2" data-dashjs-player controls>
      </video>
   </div>
<script src="main.js"></script>
</body>
</html>

JS：

function testVideo() {
   var AXINOM_DEMO_WV_LS = "http://drm-widevinelicensing.axtest.net/AcquireLicense";
   var AXINOM_DEMO_header = "X-AxDRM-Message";
   var AXINOM_DEMO_key = "here is the key";
   var player = new dashjs.MediaPlayer().create();
   var element = document.querySelector("#vid2");
   player.attachProtectionData({
     "com.widevine.alpha": new dashjs.MediaPlayer.vo.protection.ProtectionData(AXINOM_DEMO_WV_LS, AXINOM_DEMO_header, AXINOM_DEMO_key)
   });
   document.getElementById("playButton").click(function() {
     var videoUrl = 'http://media.axprod.net/TestVectors/v6-MultiDRM-MultiKey/Manifest_1080p.mpd';
     player.initialize(element, videoUrl, true);
   });
};

因此，我在控制台中收到“Uncaught TypeError: Cannot read property 'protection' of undefined”。我已经根据下面链接的文档准备了 protectionData 部分。

http://vm2.dashif.org/dash.js/docs/jsdocs/MediaPlayer.vo.protection.ProtectionData.html

是否有人可以为我提供一个工作示例，应该如何在 dash.js 中处理 multi-drm 内容，或者解释我应该在我的代码中进行哪些更改？

提前致谢。

【问题讨论】：

标签： javascript video media-player dash.js

【解决方案1】：

有一个 DRM quick start example on GitHub 使用 Axinom DRM 许可证服务器的确切内容，非常完美地反映了您的场景。

您也可以在浏览器中找到live deployment of the example project，快速查看用户观点。

如果阅读该指南后仍有不清楚的地方，请编辑您的问题，我将编辑此答案以详细扩展缺失的部分！

【讨论】：

谢谢！我之前没有找到这个指南。我会试一试并在测试后更新案例。

【解决方案2】：

您链接到的文档适用于 1.5.1 版。

v2.3.0 的文档可以在http://cdn.dashjs.org/v2.3.0/jsdoc/index.html找到

【讨论】：

我发帖作为答案，因为我的代表不够高，无法发表评论:(

【解决方案3】：

更新的 JS

function testVideo() {
var AXINOM_DEMO_WV_LS = "http://drm-widevinelicensing.axtest.net/AcquireLicense";
var AXINOM_DEMO_key = "here is the key";
var player = new dashjs.MediaPlayer().create();
var element = document.querySelector("#vid2");
player.setProtectionData({
    "com.widevine.alpha": {
        "serverURL": AXINOM_DEMO_WV_LS,
        "httpRequestHeaders": {
            "X-AxDRM-Message": AXINOM_DEMO_key
        };
    };
});
document.getElementById("playButton").click(function() {
    var videoUrl = 'http://media.axprod.net/TestVectors/v6-MultiDRM-MultiKey/Manifest_1080p.mpd';
    player.initialize(element, videoUrl, true);
 });
};

【讨论】：