Html 以 HTML5 格式呈现的 H.264 编码 MP4 在 Safari 上播放,但在 iOS 设备上不播放
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4240915/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
H.264 encoded MP4 presented in HTML5 plays on Safari but not iOS devices
提问by Tom
I'm using Adobe Media Encoder CS5 to encode a FLV file to H.264 to present on the web via HTML5 and the video file plays just fine in Safari in OS X (and in Firefox encoded to OGG) but on any iOS device (iPad, iPhone) I get the play icon with the slash running through it.
我正在使用 Adobe Media Encoder CS5 将 FLV 文件编码为 H.264 以通过 HTML5 呈现在网络上,并且视频文件在 OS X(以及编码为 OGG 的 Firefox)中的 Safari 中播放得很好,但在任何 iOS 设备上( iPad、iPhone)我得到了带有斜线的播放图标。
Has anyone encountered this before and if so, any ideas as to why?
以前有没有人遇到过这个问题,如果有,有什么想法吗?
Thanks.
谢谢。
回答by BishopZ
We had this problem and found that encoding the files in accordance with iPhone's webview's standards created files that played fine.
我们遇到了这个问题,发现按照 iPhone 的 webview 标准对文件进行编码会创建播放良好的文件。
Not all H.264 encoded Mp4 files are supported by iPhone (or Chrome for that matter) and slight differences in the encoding process can produce videos that do not work. Even if the EXACT same encoding settings were used, H.264 is a variable bit-rate encoder, so different videos may exceed bitrate limits, causing some to work and other not.
并非所有 H.264 编码的 Mp4 文件都受 iPhone(或 Chrome)支持,编码过程中的细微差异可能会产生无法正常工作的视频。即使使用完全相同的编码设置,H.264 也是可变比特率编码器,因此不同的视频可能会超过比特率限制,导致一些工作和其他不工作。
The encoding settings that were successful for us were:
对我们来说成功的编码设置是:
- Only use the H.264 Baseline Profile Level 3.0
- Resolution below 640 x 480 and framerate up to 30 fps
- B frames are not supported in the Baseline profile.
- bitrate limit of 900kb.
- 仅使用 H.264 Baseline Profile Level 3.0
- 低于 640 x 480 的分辨率和高达 30 fps 的帧率
- 基线配置文件不支持 B 帧。
- 比特率限制为 900kb。
Here is the referencewe used to arrive at those settings.
这是我们用来达到这些设置的参考。
回答by Jeff
I know this has a marked answer, but we had the exact same issue.
我知道这有一个明显的答案,但我们遇到了完全相同的问题。
The problem ended up being a setting on our internal network.
问题最终是我们内部网络上的一个设置。
After turning on the safari console on the iPad, we saw that when trying to load the video we were getting a "byte_range_error_message" being logged. It seems the mobile devices request this content differently than desktop devices, by requesting certain bytes at a time. We managed to find out that the video played fine when the phones used their 3G networks, but not when they loaded the video through the internal wifi. A lot of research later led us to this MSDN article: http://support.microsoft.com/kb/922330
在 iPad 上打开 safari 控制台后,我们看到在尝试加载视频时,我们记录了“byte_range_error_message”。似乎移动设备通过一次请求某些字节来请求此内容与桌面设备不同。我们设法发现当手机使用其 3G 网络时视频播放良好,但当他们通过内部 wifi 加载视频时则无法播放。后来经过大量研究,我们找到了这篇 MSDN 文章:http: //support.microsoft.com/kb/922330
Which explained how to find the setting in our firewall to allow the devices to request the video properly. We also found a similar setting on one of our D-Link routers for a separate wifi network that was also having the problem.
其中解释了如何在我们的防火墙中找到设置以允许设备正确请求视频。我们还在我们的一个 D-Link 路由器上发现了一个类似的设置,用于单独的 wifi 网络也有问题。