如何在iOS(iPhone和iPad)上播放带有HTML5视频标签的mp4视频文件？

Question

我想使用视频标记向用户显示HTML5视频.对于Firefox,Chrome和Opera WEBM按预期工作.在Windows和Mac上的Safari中,我的MP4版本也可以使用.我遇到的唯一问题是它不会在iPad和iPhone上播放(当然是Safari).

制作视频

MP4(h.264 + acc-lc)是这样转换的(带有配置文件:基线和3.0级以实现与iOS的最大兼容性):

• 流#0:0(eng):视频:h264(约束基线)(avc1/0x31637661),yuv420p,640x352,198 kb/s,17 fps,17 tbr,17408 tbn,34 tbc(默认)
• 流#0:1(eng):音频:aac(LC)(mp4a/0x6134706D),48000 Hz,立体声,fltp,56 kb/s(默认)

编辑:整个ffprobe输出(比特率略有变化等,如上所述):

Metadata:
major_brand     : isom
minor_version   : 512
compatible_brands: isomiso2avc1mp41
encoder         : Lavf56.30.100
Duration: 00:01:00.05, start: 0.046440, bitrate: 289 kb/s
Stream #0:0(eng): Video: h264 (Constrained Baseline) 
(avc1 /0x31637661), yuv420p, 640x352, 198 kb/s, 25 fps, 25 tbr, 
12800 tbn, 50 tbc (default)
Metadata:
  handler_name    : VideoHandler
Stream #0:1(eng): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, 
stereo, fltp, 85 kb/s (default)
Metadata:
  handler_name    : SoundHandler

我发现iOS设备等的各种要求,这和这,也有人提到添加YUV420P像素格式转换的时候.

事实上,ffmpeg cmd看起来像这样:

ffmpeg -i __inputfile__ -vcodec libx264 -pix_fmt yuv420p -profile:v baseline -level 3.0 -b:v 200K -r 17 -bt 800K -c:a libfdk_aac -b:a 85k -ar 44100 -y __outputfile_lowversion__.mp4

显示视频

随着Modernizr的我发觉其格式为"支持",并把它添加到src或video标签.最后一件事是添加正确的MIME类型.对于mp4我添加type="video/mp4".video标签的完整代码是:

<video class="p-video" preload="auto" autoplay="" type="video/mp4" src="http://full.url/to/video_low.mp4"/>

我尝试了各种方法:自己实现自己的界面,控件和来自浏览器供应商和video.js的东西,只是为了检查我是否太喜欢这个.除了iPhone和iPad之外,所有工作都在上面列出的环境中工作.

我在网上看了这篇关于视频的文章,特别是这部分,只提供没有poster属性集的"正确"类型的"正确"文件.

我的Apache有

AddType video/mp4                      mp4 m4v f4v f4p
AddType video/ogg                      ogv
AddType video/webm                     webm

并且启用了字节范围.这是从服务器获取部分内容所必需的.

有谁知道那里发生了什么？提前致谢!

编辑: Safari和Chrome都MEDIA_ERR_SRC_NOT_SUPPORTED在iPad上抛出错误.编码必定存在问题.

Answer 1

我找到了iPad和iPhone无法播放的原因。我的文件夹通过 htaccess 进行了限制访问，以保护测试版应用程序。Firefox 等会将用户名和密码转发给所有请求，Mac 上的 safari 会再次要求提供凭据，但 iPad 和 iPhone 上的浏览​​器不会。为了快速检查这一点，我删除了文件夹保护并且工作正常。感谢您对我的问题的所有贡献和想法！