html5 – 将FFMPEG编码为具有关键帧群集的MPEG-DASH或WebM – 用于MediaSource API

我正在向Chrome发送视频流,通过MediaSource API播放.

据我了解,MediaSource仅支持使用MPEG-DASH编码的MP4文件,或以关键帧开头的WebM文件(否则会引发错误:介质段未以关键帧开头).

是否有任何方式使用FFMPEG实时编码MPEG-DASH或关键帧WebM格式?

编辑:

我只是用ffmpeg … -f webm -vcodec vp8 -g 1 …尝试,所以每一帧都是一个关键帧.不是理想的解决方案.它现在与MediaStream工作.使用WebM中的关键帧同步分段的任何方式,所以不是每个帧都需要一个关键帧?

关于WebM / MP4和MediaSource的参考问题:

Media Source Api not working for a custom webm file (Chrome Version 23.0.1271.97 m)

MediaSource API and mp4

解决方法

目前FFMPEG不支持DASH编码.您可以使用FFMPEG( https://www.ffmpeg.org/ffmpeg-formats.html#segment_002c-stream_005fsegment_002c-ssegment)进行分段,但我建议将FFMPEG和MP4Box进行组合.使用FFMPEG转码实时视频,然后使用MP4Box进行分段并创建.mpd索引.

MP4Box是GPAC(http://gpac.wp.mines-telecom.fr/)的一部分.

以下是使用h264的示例:

ffmpeg -threads 4 -f v4l2 -i  /dev/video0 -acodec libfaac -ar 44100 -ab 128k -ac 2 -vcodec libx264 -r 30 -s 1280x720  -f mp4 -y "$movie" > temp1.mp4 && MP4Box -dash 10000 -frag 1000 -rap "$movie"

如果您需要VP8(WebM),请使用:-vcodec libvpx和-f webm或-f ts.

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码