ios - HTML5 视频播放器在 iPad/iPhone 上不起作用

标签 ios html video ffmpeg

注意 原来这是模拟器问题,而不是视频编码问题,请参阅我的编辑下方...

我正在为本地一所大学创建一个网站,他们希望能够添加人们可以在线观看的短视频。我花了很多时间试图弄清楚如何让视频在 iDevices 上播放,但失败了。

我正在使用 Video.js ( http://www.videojs.com ),并且 HTML 看起来像这样...

<video id="videoplayer" class="video-js vjs-default-skin" controls preload="auto" width="640" height="352" poster="/Content/Images/logobg.png" data-setup='{}'>
  <source src="/Content/Videos/video.m4v" type="video/mp4">
  <source src="/Content/Videos/video.webm" type="video/webm">
  <p class="vjs-no-js">
    To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
  </p>
</video>

这在使用 m4v 文件的桌面浏览器上运行良好。但是,如果我在 iDevice 上加载页面,视频播放器会显示“找不到此视频的兼容源”,这听起来既不喜欢 m4v 文件,也不喜欢 webm 文件。

我使用 http://daniemon.com/blog/how-to-convert-videos-to-webm-with-ffmpeg/ 中的说明创建了 webm 文件.我尝试使用 iPad Doesn't Render H.264 Video with HTML5 上接受的答案创建一个 .mov 文件,但这给出了同样的错误。

有人知道我如何支持 iDevices 吗?请不要对科学视而不见,我是所有这些视频内容的真正新手,需要简单的说明!

编辑 我遇到的问题是尝试在移动模拟器上查看该网站时。当我将站点上传到真实服务器并在 iPad 上尝试时,它运行良好。因此,如果有人遇到类似问题,请先使用 Handbrake 之类的工具对视频进行编码,因为它似乎做得很好,然后确保您是在真正的移动设备上进行测试,而不是在模拟器上进行测试!

最佳答案

通常使用 mp4 视频文件将确保在最广泛的浏览器/设备选择上播放,包括最近的 iOS 和大多数 Android 设备。

更具体地说:mp4 容器(即文件)中的 H.264 视频、AAC 音频。

这得到了广泛的支持,因此您在创建视频或在必要时将视频转换为这种格式时应该不会有太多麻烦。

关于ios - HTML5 视频播放器在 iPad/iPhone 上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29679767/

相关文章:

ios - dequeueReusableCellWithIdentifier 从不返回 nil

html - 如何移动此搜索表单? (CSS)

java - 如何解析 HTML 字符串以按父 div 拆分?

c++ - 在 opencv 和 Qt 中合并视频

ios - 连续播放 16 个视频后视频停止播放

ios - 带有标签和固定元素的横向模式下的 iPhone 6 Plus 奇怪错误

c# - 没有黑色细线的 UIView 边框

ios - 以编程方式在 Twitter 上发布视频

html - 我的照片库中有一个空白栏

android - 压缩视频后,在 Android 中的质量变得迟钝