2022-12-优化MP4播放器 #

1. 需求场景 #

有时候我们需要播放一个视频，而这个视频是后端生成的mp4视频，还很大，放到前端去播放，有时候会转很久才会出来。 我们需要优化。

2. 优化思路 #

首先看这个视频的http请求，发现有206的响应码，而且随着视频的播放，最后一个http会一直进行。而视频播放之前的黑屏时间是前两次206的请求响应时间，将近1秒钟。 要解决这个问题，我们要知道MP4的视频和音频信息存在哪里

MP4 文件由叫做 原子 的数据块组成。这些原子用以存储字幕和章节等内容， 当然也包括视频和音频等显而易见的数据。而视频和音频原子的元数据，以及有关如何播放视频的信息，如尺寸和每秒的帧数，则存储在叫做 moov 的特殊原子中。你可以认为 moov 原子是某种意义上的 MP4 文件目录。

作者：小小木锤 链接：https://juejin.cn/post/6844903656798568461 来源：稀土掘金 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

所以当播放视频的时候，程序会查找MP4文件，定位moov原子的位置。实际上，moov原子的位置是不确定的，如果它不在开始位置，我们可能需要下载完整个视频才能播放。 优化思路就是把moov原子放到最前面。

3. 优化方案 #

3.1 工具 #

我们可以生成MP4的工具上勾选web optimized

3.2 ffmpeg #

ffmpeg -i input.mp4 -movflags faststart -acodec copy -vcodec copy output.mp4

-movflags faststart 参数告诉 ffmpeg 把 MP4 视频的原子们重新排序以使得 moov 位于开始位置。我们同样指示 ffmpeg 拷贝视频和音频数据而不是重新编码，所以没有任何改变。

4. 206状态码 #

HTTP206状态码代表的意思是 请求已成功处理，但仅返回了部分内容，即 HTTP 206 Partial Content 响应状态。 HTTP 206 (Http Status Code 206) 状态是HTTP协议的一种响应码，是我们请求访问网站时，服务器端返回的2xx 成功状态系列响应码之一。 状态详细说明：HTTP 206 表示服务器已经成功处理了部分GET请求。类似于迅雷这类的HTTP下载工具都是使用此类响应实现断点续传或者将一个大文档分解为多个下载段同时下载。该请求必须包含Range头信息来指示客户端希望得到的内容范围，并且可能包含If-Range来作为请求条件。

如果服务器不支持http range，则没有206状态码，那么就不能做moov优化