使用ffmpeg解决网页端 视频不能边加载边播放的问题

当视频时间较长或者较大需要加载完才能开始播放时对用户体验及其不友好！这时就需要解决视频边加载边播放的问题；

第一次做视频教学网站，使用的ckplayer播放器，在测试时发现客户上传的视频必须加载完才能播放，如下图1-1：

1-1

 

但是我们自己上传的视频就可以边加载边播放，如下图1-2：

1-2

 

带着疑问我去后台把两个视频都下载下来寻找两个视频的共同点和不同点（2.mp4是正常边加载边播放的，hm.mp4是需要加载完才能播放的）；

1-3

 

共同点：都是mp4格式；

接下来寻找不同点，根据ckplayer手册 http://www.ckplayer.com/tool/help/64.htm

提到：因为网页上的视频播放器播放视频是以流的形式加载（即没办法直接加载视频结尾的数据，只能从前向后加载），所以播放器必需要读取到元数据信息才可以进行播放，元数据信息需在视频的第一帧才可实现边加载边播放的效果；

根据这个我去验证了hm.mp4，直接把视频的元数据移入到第一帧，看是否成功；

下面介绍将视频的元数据移入第一帧的方法：

首先去下载ffmpeg  http://ffmpeg.zeranoe.com/builds/

和qt-faststart    http://www.ckplayer.com/down/qt-faststart.rar

然后运行下面3个文件：

1-4

 

接着ctrl + r输入cmd打开命令板，找到你所解压的bin文件夹下输入 qt-faststart.exe F:/hm.mp4 F:/hm2.mp4 （前面是你的源视频地址，后面是将视频元数据移到第一帧的视频地址，文件名可以自己随意命名） 再回车

结果发现并没有成功，报错信息“last atom in file was not a moov atom” 视频的最后的元数据不是视频moov信息，也就是尚未捕获到该视频的元数据；

1-5

这样我们就需要将视频先转码，使用刚开始下载的ffmpeg，里面有三个工具

ffmpeg.exe：音视频转码、转换器

ffplay.exe：简单的音视频播放器

ffprobe.exe：简单的多媒体码流分析器

 

1-6

 

 

使用ffmpeg.exe来实现视频转码，ffmpeg.exe -i F:\hm.mp4 -acodec copy -vcodec copy F:\hm2.mp4（第一个视频是源视频，第二个是转码后的视频地址）  回车

然后就看到了关于视频元数据的一些信息

1-7

接着我们把转码后的视频元数据移入第一帧，qt-faststart.exe F:/hm2.mp4 F:/hm3.mp4  回车

1-8

最后把hm3.mp4从后台上传，再播放视频的时候就可以实现边加载边播放了