HTML5视频没有在iPad上显示

时间:2021-10-17 19:01:03

I've encoded a few videos on http://www.theparkerpalmsprings.com to play using HTML5 when loaded via an iPhone or iPad. In my testing, everything works as expected when viewing the site on an iPhone (I've tested on a 3G and iPhone 4), but when loading on the iPad the Quicktime logo flashes quickly and then nothing happens. Is this a problem with the encoding of the videos or am I doing something else incorrectly? Any input would be greatly appreciated!

我在http://www.theparkerpalmsprings.com上编码了一些视频,在通过iPhone或iPad加载时使用HTML5进行播放。在我的测试中,当我在iPhone上浏览网站时(我在3G和iPhone 4上测试过),一切都按照预期运行,但当我在iPad上加载Quicktime标识时,它会快速闪过,然后什么都不会发生。这是视频编码的问题还是我做错了什么?如有任何意见,我们将不胜感激!

A few test links (directly to pages with video):

一些测试链接(直接链接到带有视频的页面):

http://theparkerpalmsprings.com/spa/ (large video on iPad, small video on iPhone) http://theparkerpalmsprings.com/rooms/estate.php (small video for both platforms)

http://theparkerpalmsprings.com/spa/ (iPad上的大视频,iPhone上的小视频)http://theparkerpalmsprings.com/rooms/estate.php(两个平台上的小视频)

3 个解决方案

#1


32  

The answer was incredibly simple, which is why it was overlooked:

答案非常简单,这就是为什么它被忽视的原因:

The iPad requires you to include the "controls" attribute in the video tag, otherwise there's no way for it to start playback of the video, unlike on the iPhone, where a large play button appears over all HTML5 video elements. The videos were all encoded properly but this simple tag was skipped over. Hopefully this will save someone the headache it caused me.

iPad要求你在视频标签中包含“控件”属性,否则它无法开始播放视频,不像iPhone,在所有HTML5视频元素上都有一个大的播放按钮。视频都被正确地编码了,但是这个简单的标签被跳过了。我希望这能帮我挽回一些让我头疼的人。

#2


3  

Please don't sniff User-Agent!

请不要嗅用户代理!

That completely misses the point of interoperability HTML5 tries to bring (and fails in my Flash-blocked desktop browser). <object> and <video> support automatic fallback and detection.

这完全忽略了HTML5试图带来的互操作性(在我的flash阻塞桌面浏览器中失败了)。


Did you encode video as H.264 Baseline Profile? Flash supports full H.264 (High Profile), but iDevices can handle only lower-quality variants (iPad & iPhone 4 support Main, older devices only Baseline. Similarily with AAC.).

你是否将视频编码为H.264基线文件?Flash支持完整的H.264(高调),但iDevices只能处理低质量的变体(iPad和iPhone 4只支持主要的、旧的设备只基线)。相似和AAC)。


If you ever add alternative format (WebM), put H.264 <source> first, as iOS 3.2 cannot handle source selection properly.

如果您添加了可选格式(WebM),请将H.264 放在前面,因为iOS 3.2不能正确地处理源选择。

#3


2  

Same result on my iPad. Are you intending to stream the video? If so you'd need to follow Apple's Technical note TN2224.

在我的iPad上也是如此。你打算把录像录下来吗?如果是这样的话,你需要遵循苹果的技术说明TN2224。

#1


32  

The answer was incredibly simple, which is why it was overlooked:

答案非常简单,这就是为什么它被忽视的原因:

The iPad requires you to include the "controls" attribute in the video tag, otherwise there's no way for it to start playback of the video, unlike on the iPhone, where a large play button appears over all HTML5 video elements. The videos were all encoded properly but this simple tag was skipped over. Hopefully this will save someone the headache it caused me.

iPad要求你在视频标签中包含“控件”属性,否则它无法开始播放视频,不像iPhone,在所有HTML5视频元素上都有一个大的播放按钮。视频都被正确地编码了,但是这个简单的标签被跳过了。我希望这能帮我挽回一些让我头疼的人。

#2


3  

Please don't sniff User-Agent!

请不要嗅用户代理!

That completely misses the point of interoperability HTML5 tries to bring (and fails in my Flash-blocked desktop browser). <object> and <video> support automatic fallback and detection.

这完全忽略了HTML5试图带来的互操作性(在我的flash阻塞桌面浏览器中失败了)。


Did you encode video as H.264 Baseline Profile? Flash supports full H.264 (High Profile), but iDevices can handle only lower-quality variants (iPad & iPhone 4 support Main, older devices only Baseline. Similarily with AAC.).

你是否将视频编码为H.264基线文件?Flash支持完整的H.264(高调),但iDevices只能处理低质量的变体(iPad和iPhone 4只支持主要的、旧的设备只基线)。相似和AAC)。


If you ever add alternative format (WebM), put H.264 <source> first, as iOS 3.2 cannot handle source selection properly.

如果您添加了可选格式(WebM),请将H.264 放在前面,因为iOS 3.2不能正确地处理源选择。

#3


2  

Same result on my iPad. Are you intending to stream the video? If so you'd need to follow Apple's Technical note TN2224.

在我的iPad上也是如此。你打算把录像录下来吗?如果是这样的话,你需要遵循苹果的技术说明TN2224。