HTML5 视频:ffmpeg 编码的 MP4 不在任何浏览器中播放(虽然在 VLC 中播放)

Posted

技术标签:

【中文标题】HTML5 视频:ffmpeg 编码的 MP4 不在任何浏览器中播放(虽然在 VLC 中播放)【英文标题】:HTML5 video: ffmpeg-encoded MP4 not playing in any browser (plays in VLC though) 【发布时间】:2014-09-01 20:15:38 【问题描述】:

我正在尝试以 MP4 和 WEBM 格式提供 html5 视频。我无法让所有浏览器都工作:

支持 WEBM(Chrome 桌面、Firefox 桌面)的浏览器可以正常播放视频。

使用 MP4 的浏览器无法正常工作(IE、Safari、android)。

WEBM 服务为video/webm

正在以video/mp4 的身份提供MP4。

最小 JSFiddle 位于:http://jsfiddle.net/#&togetherjs=5Ql5MmrV4j


浏览器错误:

IE11:11.0.9600.17126 / 11.0.9 KB2957689

Error: Unsupported video type of invalid file path

Android 浏览器和 Chrome Android:

没有错误,视频只是拒绝开始


健全性测试 - 以下三个值相等:

收到的文件大小:curl <video URL> | wc -c

实际文件大小:stat -c %s <video file>

服务器指定的文件大小:Content-Length HTTP 标头。


有问题的视频之一位于:

MP4:http://hackology.co.uk/wp-content/uploads/2014/06/hd720-24.mp4

Content-Type: video/mp4

无法在 Chrome / IE11 / Chrome Android / Android 浏览器中播放

在 VLC 中播放

FFMPEG编码参数:

-an -vcodec libx264 -s hd720 -flags +loop+mv4 -cmp 256 -partitions +parti4x4+parti8x8+partp4x4+partp8x8 -subq 6 -trellis 0 -refs 5 -bf 0 -coder 0 -me_range 16 -g 250 -keyint_min 25 -sc_threshold 40 -i_qfactor 0.71 -qmin 10 -qmax 51 -qdiff 4 -movflags faststart

这些是通过深入搜索为移动浏览器编码 MP4 的最佳方式而收集的。 如果我使用-an -vcodec libx264 -s hd720,那么该视频也无法在浏览器中播放。

WEBM:http://hackology.co.uk/wp-content/uploads/2014/06/hd720-24.webm

Content-Type: video/webm

在 Chrome/Firefox 中播放

FFMPEG编码参数:

-an -vcodec libvpx -s hd720


相关的 HTML(课程、海报等已删除):

<video preload="metadata" controls="controls">
  <source type="video/mp4" src="http://hackology.co.uk/wp-content/uploads/2014/06/hd720-24.mp4">
  <source type="video/webm" src="http://hackology.co.uk/wp-content/uploads/2014/06/hd720-24.webm">
</video>

JSFiddle http://jsfiddle.net/#&togetherjs=5Ql5MmrV4j

【问题讨论】:

【参考方案1】:

实际上似乎没有播放 MP4 的浏览器完全支持 MP4 - 对于试图围绕格式创建版税地狱/垄断的 MS 和 Apple 浏览器来说尤其成问题。

我通过使用以下 FFMPEG 参数重新编码使其工作:

-pix_fmt yuv420p
-preset slow
-profile:v baseline

给出完整的命令行:

ffmpeg
  <INPUT DEFINITION>    # e.g. -i <FILE>
  -an    # if you won't want audio, otherwise -acodec libaac -b:a 128k
  -s hd720
  -vcodec libx264
  -b:v BITRATE    # e.g. 4M
  -vcodec libx264
  -pix_fmt yuv420p
  -preset slow
  -profile:v baseline
  -movflags faststart
  -y <OUTPUT PATH>

问题归根结底是专有软件供应商没有正确支持自己的标准的另一个例子。

【讨论】:

嘿,我知道你已经有一段时间没有“修复”这个问题了,但不幸的是我现在遇到了同样的问题,我的 ffmpeg 命令是:ffmpeg -i inputfile -b: v 2500k -vcodec libx264 -vprofile main -acodec livbo_aacenc -b_a 128k 输出如果你能帮助我会很棒。 使用基线配置文件和 yuv420p 二次采样,以及 mp3 音频编解码器 显然-level 3.0 也有帮助,但我从来不需要它

以上是关于HTML5 视频:ffmpeg 编码的 MP4 不在任何浏览器中播放(虽然在 VLC 中播放)的主要内容,如果未能解决你的问题,请参考以下文章

使用 ffmpeg 将视频转换为 MP4 (H.264/AAC)

使用 FFMPEG 的 PHP HTML5 兼容 MP4 视频

用于将 HTML5 视频转换为 mp4 和 ogg 的 ffmpeg 设置 [关闭]

FFMPEG 转换的视频在 HTML5 中不起作用

ffmpeg将yuv文件编码为mp4

FFmpeg4入门13:h264编码为mp4