什么是 Encrypted Media Extensions（EME）
相信小伙伴在上一些视频网站的时候，在你截屏或录屏的时候，图片是黑屏或视频区域是黑色，为什么这些视频网站能防录屏？可能有小伙伴要说了，可以监听用户快捷键啊，我只能说想得还是太简单了～如果仅仅是靠一些 JS，那可绕过的方法实在太多了！
必须是浏览器原生支持的 API 才可行，这个就是 Encrypted Media Extensions。
Encrypted Media Extensions 是 W3C Web API，用于让浏览器播放受 DRM（Digital Rights Management 数字版权保护）加密的媒体。用通俗一点的话来说：EME 就是一套 JS API，用来控制浏览器的 DRM 解密模块。
更多详细的介绍可以参考官方文档：https://www.w3.org/TR/encrypted-media/
常见 DRM：
| 平台 | DRM |
|---|---|
| Chrome、Android | Google Widevine |
| Edge/Windows | Microsoft PlayReady |
| Safari/iOS/macOS | Apple FairPlay |
EME 是如何实现浏览器防截屏 / 防录屏
在浏览器层面，EME + DRM 可以实现防截屏 / 防录屏：
媒体文件是加密的 内容本身是加密视频（如 Widevine Modular 加密）。
浏览器通过 CDM 模块解密 浏览器内置一个 CDM（Content Decryption Module）。
例如 Chrome 内置 Widevine CDM CDM 运行在沙箱，不暴露密钥
禁止系统级截屏（取决于 DRM）
例如在 Chrome 上播放 Netflix 时： 用系统截图键 → 图片是黑屏 用屏幕录制 → 视频区域是黑色
这是因为：
Widevine L1（硬件级）支持防截屏 DRM 解密后的视频帧不会进入 CPU 层，而是直接通过 GPU 的保护路径输出 截屏 API 无法捕获受保护的视频帧
禁止浏览器扩展抓取视频帧 DRM 视频帧在受保护的视频管线（Video Pipeline）中，扩展无法获取。
禁止调试工具记录媒体流 媒体解密密钥不会暴露在 JS 中。
EME 播放加密媒体的代码示例
我们知道 EME 是一套 W3C 标准化的 JavaScript API，它在不暴露密钥和明文数据的前提下，充当网页应用、浏览器和底层 DRM 系统（CDM）之间的'安全信使'！
以下示例展示一个使用 EME 播放加密 DASH（mpd）视频的完整流程。
注意：需要服务器提供 License Server 才能真正播放。
创建 video 标签
<video id="video" controls width="600"></video>
JavaScript 初始化 EME
const video = document.getElementById("video");
async function initEME() {
// 请求支持的 DRM，如 Widevine
const keySystem = "com.widevine.alpha";
// 配置
const config = [{
initDataTypes: ["cenc"],
videoCapabilities: [{
contentType: 'video/mp4; codecs="avc1.64001E"'
}]
}];
// 请求 DRM 支持
const access = await navigator.requestMediaKeySystemAccess(keySystem, config);
const mediaKeys = await access.createMediaKeys();
await video.setMediaKeys(mediaKeys);
console.log("EME 初始化成功");
}
initEME();
处理 license 请求
模拟从许可证服务器获取许可证。
video.addEventListener("encrypted", async (event) => {
const session = video.mediaKeys.createSession();
session.addEventListener("message", async (e) => {
// 向授权服务器发送的消息
const license = await fetch("/license", {
method: "POST",
body: e.message
}).then(r => r.arrayBuffer());
// 将 license 喂给 CDM
await session.update(license);
});
// 初始化 CDM
await session.generateRequest(event.initDataType, event.initData);
});
设置加密视频源
video.src = "https://example.com/encrypted.mpd"; // 加密视频
如何为你的应用选择方案？
如果你的核心需求是防止用户复制、下载、非法传播视频/音频内容，那么你需要实现 EME DRM。这需要后端准备加密的内容、部署许可证服务器，并前端集成相应的 DRM 厂商（如 Widevine）的 SDK。
如果你的核心需求是防止用户通过截屏、录屏泄露应用界面（如聊天窗口、文档、软件界面），那么你应该寻找操作系统或框架提供的防截屏 API。对于 Web 应用，这通常意味着你需要将应用打包为 Electron 等桌面应用才能实现。
总结
EME 本质是浏览器访问 DRM 的 API，本身不实现防录屏。真正的防录屏能力来自 DRM（Widevine / PlayReady / FairPlay）以及设备硬件。在 L1 级设备上，可完全禁止系统级截屏与录屏；在 PC 浏览器（L3）上基本无法防。
如果你计划构建一个防盗录系统，应采用：
DRM 加密 → 授权服务器 移动端 App 或支持 L1 的浏览器 加上行为水印 / 动态鉴权等配套策略
