Skip to main content

Media Capabilities API - 允许开发人员确定设备的解码和编码能力

Media Capabilities API（媒体功能 API）允许开发人员确定设备的解码和编码能力，提供诸如是否支持媒体以及播放是否应该流畅和节能等信息。通过对播放的实时反馈，更好地实现自适应流媒体，并访问显示属性信息。

实例

检测音频文件支持和预期性能

这个例子定义了一个音频配置，然后检查用户代理是否支持解码该媒体配置，以及它在平滑度和功率效率方面是否表现良好。

if ('mediaCapabilities' in navigator) {
  const audioFileConfiguration = {
    type : 'file',
    audio : {
        contentType: "audio/mp3",
        channels: 2,
        bitrate: 132700,
        samplerate: 5200
    }
  };

  navigator.mediaCapabilities.decodingInfo(audioFileConfiguration).then(result => {
    console.log('该配置是' +                     
        (result.supported ? '' : '不') + '支持的，' +
        (result.smooth ? '' : '不') + '平滑的，且' +
        (result.powerEfficient ? '' : '不') + '节能的。');
    })
    .catch(() => {
      console.log("解码信息错误：" + contentType)
    });
}

Media Capabilities API 概念和用法

有无数的视频和音频编解码器。不同的浏览器支持不同的媒体类型，新的媒体类型一直在开发中。借助 Media Capabilities API，开发人员可以确保每个用户都能获得适合其浏览器、设备和操作系统能力的最佳比特率和占用最小空间。

设备使用硬件解码还是软件解码会影响视频解码的流畅度和功率效率以及播放的效率。Media Capabilities API可以确定支持哪些编解码器，以及媒体文件在平滑度和电源效率方面的性能。

Media Capabilities API 提供了比 MediaRecorder.isTypeSupported() 或 HTMLMediaElement.canPlayType() 更强大的功能，后者仅解决一般浏览器支持，而不是性能。API 还提供访问显示属性信息的功能，例如支持的色域、动态范围功能和有关播放的实时反馈。

要测试视频或音频文件的支持、流畅度和是否节能，您可以定义要测试的媒体配置，然后将音频或视频配置作为 MediaCapabilities 接口的 encodingInfo() 和 decodingInfo() 方法的参数。

媒体功能信息使网站能够启用自适应流媒体，以根据用户实际感知的质量来改变内容质量，并对 CPU/GPU 的使用情况做出实时反应。

媒体功能接口

`MediaCapabilities`

根据编解码器、配置文件、分辨率和比特率提供有关设备、系统和浏览器解码能力的信息。该信息可用于为用户提供最佳媒体流，并确定播放是否应该流畅且节能。

`MediaCapabilitiesInfo`

mediaCapabilities 的 [`encodingInfo()`](/en-US/docs/Web/API/MediaCapabilities/encodingInfo) 和 [`decodingInfo()`](/en-US/docs/Web/API/MediaCapabilities/decodingInfo) 方法返回的 promise 解析出的接口；返回测试的媒体配置是否受支持、流畅和节能。

ScreenColorGamut

将描述屏幕可以显示的色域或颜色范围（目前没有任何地方支持）。

ScreenLuminance

将描述屏幕的已知亮度特性（目前没有任何地方支持）。

Media Capabilities 字典

`MediaConfiguration`

描述了视频和音频配置字典必须如何配置或定义，以作为 MediaCapabilities.encodingInfo() 和 MediaCapabilities.decodingInfo() 方法的参数传递。它被 MediaDecodingConfiguration 和 MediaEncodingConfiguration 字典所继承。

`MediaDecodingConfiguration`

当媒体配置作为 MediaCapabilities.decodingInfo() 的参数提交时，定义允许的媒体类型的有效值。由媒体解码类型和 VideoConfiguration 或 AudioConfiguration 字典组成。

`MediaEncodingConfiguration`

当媒体配置作为 mediaCapabilities.encodingInfo() 的参数提交时，定义了允许的媒体类型的有效值。由媒体编码类型和 VideoConfiguration 或 AudioConfiguration 字典组成。

`VideoConfiguration`

描述了在查询视频配置时必须配置的必要视频属性，以作为 MediaConfiguration 参数的一部分传递给 MediaCapabilities.encodingInfo() 和 MediaCapabilities.decodingInfo() 方法。

`AudioConfiguration`

描述了在查询音频配置时必须配置的必要音频属性，以作为 MediaConfiguration 参数的一部分传递给 MediaCapabilities.encodingInfo() 和 MediaCapabilities.decodingInfo() 方法。

规范

规范	状态	备注
Media Capabilities	Draft	初始定义

桌面浏览器兼容性

特性	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
基础支持	66	79	63	不支持	53	13
`decodingInfo`	66¹ ²	79¹ ²	63³	不支持	53¹ ²	13
`encodingInfo`	67	79	63	不支持	54	15.4

移动浏览器兼容性

特性	Android	Chrome for Android	Edge mobile	Firefox for Android	IE mobile	Opera Android	iOS Safari
基础支持	66	66	未知	63	未知	48	13
`decodingInfo`	66¹ ²	66¹ ²	未知	63³	未知	48¹ ²	13
`encodingInfo`	不支持	67	未知	63	未知	不支持	15.4

1. codecs string can contain any subset of optional parameters (should be all or none).

2. Errors if codecs string contains unexpected characters (should evaluate string up to character).

3. Before Firefox 101, decodingInfo() ignored codecs parameter options for av01 codecs (treating them as av1).

相关链接

HTMLMediaElement 的 canPlayType() 方法
MediaSource 的 isTypeSupported() 方法
Navigator 接口
使用媒体功能 API

实例
- 检测音频文件支持和预期性能
Media Capabilities API 概念和用法
媒体功能接口
Media Capabilities 字典
规范
桌面浏览器兼容性
移动浏览器兼容性
相关链接