HTML5 mp4 视频在 Chrome 和桌面 Safari 中工作，但在 iPhone 中不可用

Question

我正在尝试简单地播放 HTML5 视频，该视频将与所有常见浏览器（包括移动设备）兼容。目前，我正在使用一个自定义视频和一个示例视频进行测试。

<video width="680" height="383" controls>
    <source src="immunize-video-1/immunize_web_h.264.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
    <source src="immunize-video-1/immunize_web_h.264.ogv" type='video/ogg; codecs="theora, vorbis"'>
    [FLASH FALLBACK HERE]
</video>
<video width="680" height="383" controls>
    <source src="big-buck-bunny/big_buck_bunny.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
    <source src="big-buck-bunny/big_buck_bunny.ogv" type='video/ogg; codecs="theora, vorbis"'>
    [FLASH FALLBACK HERE]   
</video>

登台服务器上的结果：

• 铬：好的
• 桌面 Safari 5：好的 (screenshot)
• iPhone Safari：顶部视频不播放（截图如下）

什么可能导致它在桌面 Safari 上运行但在 iPhone 上运行不正常？我在video type parameters 上尝试了一些变体，例如：

<source src="immunize-video-1/immunize_web_h.264.mp4" type='video/mp4; codecs="avc1.64001E, mp4a.40.2"'>

还尝试将编解码器属性留空：

<source src="immunize-video-1/immunize_web_h.264.mp4" type='video/mp4'>

但没有列出的似乎适用于 iPhone。视频以 3000 kb/s h.264 的速度导出。

此外，导致问题的视频文件大小为 94MB。

Answer 1

iOs 不支持 h.264 提供的所有配置文件。您必须仅使用基线配置文件对 h264 进行编码，以便它可以在 iphone/ipad 上播放。

Answer 2

请尝试使用 QuickTime Player 导出为 iPhone 优化的视频，查看这篇博文http://www.treysmithblog.com/how-to-make-html5-videos-for-iphone-and-ipad/