WebCodecs API 浏览器支持

WebCodecs API — WebCodecs API 通过 VideoEncoder、VideoDecoder、AudioEncoder 和 AudioDecoder，为网页应用提供逐帧、硬件加速的音视频编解码底层能力。

浏览器与生态支持

• 图例
• 支持
• 部分支持
• 需开启标志
• 不支持
• 未知

浏览器 / 平台	支持	版本	置信度	来源	备注
Chrome (Desktop)	支持	94	高	来源	1
Chrome (Android)	支持	94	高	来源	23
Edge (Desktop)	支持	94	高	来源	45
Firefox (Desktop)	支持	130	高	来源	6
Firefox (Android)	不支持	—	高	来源	78
Safari (macOS)	支持	16.4	高	来源	9
Safari (iOS)	支持	16.4	高	来源	1011
Samsung Internet	支持	17.0	高	来源	1213
WebView (Android)	支持	94	高	来源	1415
Chrome (Desktop)	支持	94	高	来源	16
Chrome (Android)	支持	94	高	来源	1718
Edge (Desktop)	支持	94	高	来源	1920
Firefox (Desktop)	支持	130	高	来源	21
Firefox (Android)	不支持	—	高	来源	2223
Safari (macOS)	支持	26	高	来源	24
Safari (iOS)	支持	26	高	来源	2526
Samsung Internet	支持	17.0	高	来源	2728
WebView (Android)	支持	94	高	来源	2930

1. 对应 `VideoDecoder` 条目。
2. 对应 `VideoDecoder` 条目。
3. 由 browser-compat-data 镜像自 Chrome 的数据推导。
4. 对应 `VideoDecoder` 条目。
5. 由 browser-compat-data 镜像自 Chrome 的数据推导。
6. 对应 `VideoDecoder` 条目。
7. 对应 `VideoDecoder` 条目。
8. browser-compat-data 未记录 Firefox for Android 的支持。
9. 对应 `VideoDecoder` 条目。
10. 对应 `VideoDecoder` 条目。
11. 由 browser-compat-data 镜像自 Safari 的数据推导。
12. 对应 `VideoDecoder` 条目。
13. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。
14. 对应 `VideoDecoder` 条目。
15. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。
16. 对应 `AudioDecoder` 条目。
17. 对应 `AudioDecoder` 条目。
18. 由 browser-compat-data 镜像自 Chrome 的数据推导。
19. 对应 `AudioDecoder` 条目。
20. 由 browser-compat-data 镜像自 Chrome 的数据推导。
21. 对应 `AudioDecoder` 条目。
22. 对应 `AudioDecoder` 条目。
23. browser-compat-data 未记录 Firefox for Android 的支持。
24. 对应 `AudioDecoder` 条目。
25. 对应 `AudioDecoder` 条目。
26. 由 browser-compat-data 镜像自 Safari 的数据推导。
27. 对应 `AudioDecoder` 条目。
28. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。
29. 对应 `AudioDecoder` 条目。
30. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。

源数据: /compatibility/webcodecs.json · 全球使用占比: 92 % (StatCounter 2026-05)

来源: 规范 · MDN · 最近核验 2026-10-03 · 置信度: 高 (由来源计算)

如何使用

VideoDecoder 接受一个针对每个解码帧调用的 output 回调以及一个 error 回调， 随后通过 decode() 解码你传入的分块：

function createVideoDecoder(onFrame) {
  const decoder = new VideoDecoder({
    output: (frame) => {
      onFrame(frame);
      frame.close();
    },
    error: (e) => console.error(e),
  });
  return decoder;
}

如何在运行时检测

在创建 VideoDecoder 之前先检测它是否存在。如果不存在，则禁用逐帧功能并提示该功能不可用：

if ('VideoDecoder' in window) {
  enableFrameByFrameProcessing();
} else {
  disableFrameByFrameProcessing();
  showFrameByFrameUnavailableMessage();
}

实践清单

• VideoFrame 和 AudioData 对象对底层媒体资源进行引用计数——每个对象用完后应立即调用 close()。对于由 VideoDecoder 产生的输出型 VideoFrame，等待垃圾回收来释放它们 可能会造成后续解码停滞。
• Safari 自 Safari 16.4 起支持 VideoDecoder；请针对你实际需要的具体接口做特性检测，而不要 假设其他 WebCodecs 接口与 VideoDecoder 在同一版本上线。
• Firefox 在 Firefox 130 于桌面端加入了 VideoDecoder，但该改动并未扩展到 Firefox for Android，因此 VideoDecoder 在该环境中为 undefined。
• 不受支持或无效的编解码器字符串不会使 configure() 的 Promise 被拒绝——configure() 会 关闭解码器并向其 error 回调传递 NotSupportedError；只有当配置本身未通过校验时，才会 同步抛出 TypeError。请始终传入源媒体实际使用的完整编解码器字符串。

下一步

完整参考（Worker 中的用法与完整编解码器字符串要求）见 WebCodecs: low-level, hardware-accelerated audio and video encoding.

另见 WebGPU。

← 返回兼容性浏览器。