ios - html5视频标签: mp4 video not supported on iOS

标签 ios html video

我在这个网站上有一个介绍视频:http://staging.optiekcardoen.be/ .顶部的视频在大多数浏览器上自动播放,这就是我想要的行为。在 Safari iOS 上,该视频的海报图片上方只有一个播放按钮。当我点击它时,什么也没有发生...... :(

当我将 w3schools (https://www.w3schools.com/html/tryit.asp?filename=tryhtml5_video) 的 bigbugbunny 视频与绝对路径集成时,它工作得很好!当我下载相同的兔子视频时,将其上传到我的服务器并在我的视频标签中创建一个相对链接,它也不起作用。

首先,我将视频向上移动了一个更大的 z-index。问题一直存在。然后,我与我的托管服务提供商核实,将 php 版本更改为更新的版本,然后是我的 xampp php 版本。然后我问我介绍视频的制作人是否想最小化视频,但这并没有解决任何问题。

我没有可能,我很害怕。请问有人有其他可能的答案吗?

最佳答案

我认为这是一个 HTTP 与 HTTPS 的同源安全问题。

如果您在 Safari 中访问该站点并查看控制台,您将看到:

Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "http://staging.optiekcardoen.be". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.



在此处查看更多信息:https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

更新 :

正如 Sam 在评论中提到的,虽然上述问题应该得到解决,但即使绕过这个问题,主视频(不是来自 YouTube)也不会播放。主页视频也有错误的 mime 类型 - 见下文:

<source src="/files/intro-320x176-laag.mp4" type="video/webm">

更新 2

我做了一个快速测试,并验证了至少在 Safari 上,如果 Mime 类型设置为 webm,则不会播放 mp4 视频。

如果您将 mime 类型设置为 mp4,我怀疑您的视频会正常播放 - 即将上述行的末尾更改为:

<source src="/files/intro-320x176-laag.mp4" type="video/mp4">

关于ios - html5视频标签: mp4 video not supported on iOS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42671445/

相关文章:

ios - 使用 REST 使捆绑 Realm 保持最新

javascript - 禁用选择虚构日期

javascript - 如何使用 JavaScript 提高音频加载速度?

iOS AVPlayerLayer 不播放本地视频

iPhone UISearchBar 需要点击两次才能被选中

iphone - 使用javascript从iOS Corona平台中的谷歌地图获取当前位置

iphone - Iphone Cocos2d 中的滑动手势

javascript - 当我在数字类型文本框中输入 float 时,Firefox 显示错误

javascript - 从内存源中播放 html5 视频

CSS transform translate breaking Youtube 嵌入式视频