DRM-X 6.0 鸽子和橄榄枝标志DRM-X 6.0文档
◎ 简体中文

Web 与 HTML5 播放

整合 DRM-X 6.0 被保护的 Web 播放 Universal Player,合格 Shaka, PHP, ASP.NET Core自动 DRM 选择 和安全的诊断

查看 Markdown现场实例更新2026-09-05
您的后端决定访问; DRM-X 执行已签名的政策。 加密的媒体和DRM 许可证会遵循不同的传送路径 。
您的后端决定访问; DRM-X 执行已签名的政策。 加密的媒体和DRM 许可证会遵循不同的传送路径 。

先使用完整的样本#

Web 软件包包含最新的 Universal Player 本地 JavaScript 文件与类型声明、已验证的 Shaka、可运行的 PHP 应用、ASP.NET Core 示例和集成 README。生产页面可从 DRM-X CDN 加载 Shaka 和 Universal Player;软件包同时保留当前版本的本地文件,供审查、开发和受控回退使用。

  1. 在服务器端设置 Site ID、Site Key 和 Access Key。
  2. 设置可信任的已发布保护文件Content ID 并命名策略 。
  3. 用您的业务逻辑替换样本登录和应享权利决定 。

最小客户端边界#

<script src="https://drm-x6-cdn.1aicloud.com/sdk/drmx-universal-player/v1/drmx-universal-player.js"></script>
<drmx-universal-player id="player"></drmx-universal-player>
<script>
  // Call your authenticated backend, not api6.drm-x.com.
  const session = await fetch('/api/playback/session', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({contentId: 'trusted-catalog-reference'})
  }).then(r => r.json());
  await window.DrmXUniversalPlayer.start(document.querySelector('#player'), session);
</script>
浏览器不选择安全性您的后端映射了认证的用户和信任的目录引用 DRM-XContent ID 和政策模板 。

自动 DRM 行为#

  • Windows 微软 Edge 首选 PlayReady。如果合格 PlayReady 路径在重播前失败, 自动模式可能使用边框 Widevine 倒计时
  • Chrome 并获得支持 Android 浏览器使用 Widevine.
  • iPhone和iPad上的Safari使用本地的HLSFairPlay. 在支持的macOSSafari上,在有条件的ShakaMSEFairPlay上,优先使用本地的HLS倒置.
  • 兼容的华威浏览器使用合格WisePlay路径和保守的自动质量行为.

生产清单#

  • 把所有东西都收拾好 HTTPS 保留 Access Keys在服务器的秘密。
  • Cache-Control: no-store 返回回放会话响应 。
  • 不要在 localStorage 中坚持显示的 URL, 符号, 或会话响应 。
  • 保持详细的编辑日志选择输入和时限;不记录许可字节或授权.
  • 测试物理 Windows Edge, macOS Safari,iPhone/iPad 软件 Safari, Android,每个设备类 你广告。
网络SDK

通过一个 Web Component 实现 HTML5 播放#

<script
  src="https://drm-x6-cdn.1aicloud.com/shaka-player-5.2.4-drmx.2-6557ae581f1c.js"
  integrity="sha384-QzxDZ19XaYAL308fvtVjFjUX9RpRxtSfEZ1k1lm8FsRuML1MgNEORVMCtmToCFb8"
  crossorigin="anonymous"></script>
<script
  src="https://drm-x6-cdn.1aicloud.com/drmx-universal-player-1.2.0-preview.6-fa4b95431a9a.js"
  integrity="sha384-gwj1QszshenHjMEkHTTDEpozi6rbhsQgPlaq+aHBCgHiuEd2VK0P8tOB8BWaMQRr"
  crossorigin="anonymous"></script>

<drmx-universal-player
  content-id="course-12-lesson-4"
  content-type="vod"
  session-endpoint="/api/drmx/playback-session">
</drmx-universal-player>

浏览器只调用您认证的同源端点 。 自动选择合适的支持 DRM 已登记 DASH/HLS 显示。将构建比特率、音频语言/频道、字幕、图片内屏幕、全屏和回放速度。

使用Shaka, Video.js, Bitmovin, 或另一个EME播放器

从您的后端请求合同 v1, 载入 manifestUrl,并添加 Authorization: Bearer {drmLicenseToken} 仅改为 DRM 许可证和 FairPlay 证书请求 。 准确地保存不透明的挑战和许可响应字节。 在播放结束时使用返回的释放路径 。

Universal Player 播放列表和共享控件#

Web 和 Android 版本使用一个带有紧凑蓝色控件的一致的深色设置面板。 播放列表支持下一个/ 先前的, 洗牌的, 重复一个/ 全部, 并且可以自动取消。 每个项目都使用新的授权播放请求。 章节和记录元数据来自您的内容目录 。

回放速度、睡眠计时器、标题、允许的质量、音频语言、会话书签和 A-B 环绕是可用的。Web 增加了键盘快捷键、可选的查看器扫描本地复写、记录搜索和支持的浏览器 PiP 。 Android 保留本地语 Widevine 离线下载和更新. Casting和交叉设备进度需要单独的应用程序集成.

专业和企业标识设置

品牌不要出现在视频表面。 右键点击 Web 播放器,或打开设置_关于 播放器 在两个版本中,查看经授权的标志、产品信息和 播放器 版本。圆形设置控件和暗黑菜单样式共享 Android。全屏 Web 设置中还包含一个播放列表选择器。

设定 playerBranding 在您信任的后端中发送到 {"mode":"hidden"} 或 减 减 {"mode":"custom","logoUrl":"https://your-site.example/logo.png","label":"Your brand"}。该平台检查活跃的专业或企业订阅。其他计划使用 {"mode":"default"};未经授权的自定义/隐藏请求返回 403. 这与安全水印是分开的。

那个... PHP 下载包括可编辑播放列表和品牌配置。 Android 客户 ZIP 包含播放列表召回示例。将播放列表的授权保留在您的后端; 永不嵌入 API 客户端 凭据 任意一个 播放器.