从Chrome源码看audio/video流媒体实现（二）

从上文我们了解了Chrome加载音视频的缓冲控制机制和编解码基础，本篇将比较深入地介绍解码播放的过程。以Chromium 69版本做研究。

起点

由于Chromium默认不能播放Mp4，所以需要需要改一下源码重新编译一下。

编译一个能播放mp4的Chromium

具体的改动细节，可以阅读demu.io的文档，本文不再赘述。编译完成后，我们打开一个网页，找到播放器。

对照上篇的介绍，我们可以发现，Video标签内的属性列表和<source>标签是一个对一的关系。属性列表用来控制控制播放器的参数，比如缩放比例、宽高、和preload的设置，而<source>标签用来告诉浏览器有哪些不同的资源可供播放。

音视频标签的属性

上篇中我们介绍了其中一部分，本篇继续聊聊剩下的。

• src：用来告诉浏览器可以播放的资源路径。这个路径可以是本地文件，也可以是网络资源。如果有多个资源，则可以有多个<source>标签。

• type：用来告诉浏览器该资源的MIME类型，以方便解码器选择合适的解码方式。

• preload：用来控制资源的预加载方式，取值为auto、metadata、none。auto表示资源将在当前页面加载完成后加载，但不会立刻解码。metadata表示资源将在当前页面加载完成后加载，并且将开始解析以便获取资源的元信息，但不会立刻解码。none表示资源不会在当前页面加载完成后加载。

• crossorigin：用来控制是否允许跨域访问资源，取值为anonymous、use-credentials、null。anonymous表示允许跨域访问资源，但不允许发送cookie或HTTP认证凭据。use-credentials表示允许跨域访问资源，并允许发送cookie或HTTP认证凭据。null表示不允许跨域访问资源。

• controls：用来控制是否在播放器中显示控件，取值为true、false。true表示显示控件，false表示不显示控件。

音频流和视频流

一般来说，一个音视频流媒体中，音视频是分离的，即有独立的音频流和视频流。在播放的时候，播放器会分别对音频流和视频流进行解码和播放，然后将解码后的结果混合在一起，以达到音画同步的效果。

在Chrome中，音频流和视频流都是通过MediaSource来处理的。MediaSource是一个API，它允许开发者向浏览器提供音视频数据，然后浏览器会对这些数据进行解码和播放。

音频流和视频流的解码

音频流和视频流的解码都是通过解码器来完成的。解码器是一个软件组件，它负责将音视频流中的数据解码成可以播放的格式。在Chrome中，音频流的解码器是AudioDecoder，视频流的解码器是VideoDecoder。

AudioDecoder和VideoDecoder都是通过MediaCodec来实现的。MediaCodec是一个API，它允许开发者使用硬件加速来解码音视频流。

音频流和视频流的播放

音频流和视频流的播放都是通过播放器来完成的。播放器是一个软件组件，它负责将解码后的音视频数据混合在一起，然后播放出来。在Chrome中，播放器是VideoElement。

VideoElement是一个HTML元素，它可以用来播放音视频流。VideoElement有许多属性，这些属性可以用来控制播放器的行为，比如音量、播放速度、和是否循环播放。

结束

以上就是Chrome中音视频流媒体播放的大致流程。通过对这篇文章的介绍，相信你对Chrome是如何播放音视频流媒体有了更深入的了解。