WebCodecs 设备能力检测与硬解/软解降级方案
一、适用场景与目标
当业务必须使用 WebCodecs 的 VideoDecoder 进行 H.264 等解码（例如需要拿到每帧裸数据、做 SEI 解析后再自绘等）时，会面临一个问题：不同设备对「硬件解码」和「软件解码」的支持不一致，若只按一种配置初始化，在部分环境下会直接失败。
本文给出一种可复用的思路：事先判断设备能力，并在初始化时按'硬解 → 软解'逐步降级，在保证'能播就播'的前提下，尽量优先使用硬件解码以减轻 CPU 压力。重点放在能力检测与降级实现上。
二、为何要先判断设备能力
- 同一 codec、同一浏览器版本，在不同设备上：有的仅支持软解，有的支持硬解，有的两者都支持。若只写死一种
hardwareAcceleration（例如只配prefer-hardware），在仅支持软解的环境下VideoDecoder.isConfigSupported()会返回不支持，解码器无法创建。 - 事先判断可以在真正开始拉流、推数据之前就得到'当前设备能用哪种配置'，从而：
- 避免解码器创建失败后再补救；
- 便于给用户明确提示（如'当前环境仅支持软件解码，可能更耗电'或'不支持，请换浏览器'）；
- 便于在日志中区分'硬解/软解/不支持'，方便排查问题。
因此推荐：在创建 VideoDecoder 或开始播放前，先做一次设备能力检测，再按检测结果选择配置并做降级。
三、设备能力检测：判断是否支持硬件/软件解码
核心思路：用 VideoDecoder.isConfigSupported(config) 对多种配置逐一检测，得到'当前设备支持哪些组合'。
3.1 检测函数示例
/**
* 检测当前设备对 H.264 解码的支持情况（硬解 / 软解 / 不支持）
* @param options 可选，如 { codec: 'avc1.42002A', avcFormat: 'annexb' }
* @returns { supported: boolean, config: object | null, mode: 'hardware'|'software'|'none' }
*/
async function checkVideoDecoderSupport(options = {}) {
const codec = options.codec || 'avc1.42002A';
const avcFormat = options.avcFormat || 'annexb';
// 1）先试硬件解码
let config = {
codec,
avc: { format: avcFormat },
hardwareAcceleration: 'prefer-hardware',
};
result = .(config);
(result.) {
{ : , config, : };
}
config = {
codec,
: { : avcFormat },
: ,
};
result = .(config);
(result.) {
{ : , config, : };
}
config = {
: ,
: { : avcFormat },
: ,
};
result = .(config);
(result.) {
{ : , config, : };
}
{ : , : , : };
}
