Mar*_*wan 4 mp4 google-chrome cross-browser html5-video internet-explorer-11
我正在尝试在MP4和WEBM fomats中提供HTML5视频.我不能让所有的浏览器都工作:
支持WEBM(Chrome桌面,Firefox桌面)的浏览器播放视频很好.
使用MP4的浏览器无法正常工作(IE,Safari,Android).
WEBM正在服务video/webm.
MP4正在服务video/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-LengthHTTP标头.
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
<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>
Run Code Online (Sandbox Code Playgroud)
没有MP4播放的浏览器实际上似乎完全支持MP4 - 对于MS和Apple的浏览器来说尤其有问题,这些浏览器试图围绕这种格式创建版税 - 地狱/垄断.
我通过使用以下FFMPEG参数重新编码来使其工作:
-pix_fmt yuv420p
-preset slow
-profile:v baseline
Run Code Online (Sandbox Code Playgroud)
提供完整的命令行:
ffmpeg
<INPUT DEFINITION>
-an
-s hd720
-vcodec libx264
-b:v BITRATE
-vcodec libx264
-pix_fmt yuv420p
-preset slow
-profile:v baseline
-movflags faststart
-y <OUTPUT PATH>
Run Code Online (Sandbox Code Playgroud)
问题最终是专有软件供应商不能正确支持他们自己的标准的另一个例子.
| 归档时间: |
|
| 查看次数: |
8079 次 |
| 最近记录: |