video不能在iOS10 Chrome上播放

我似乎无法find这个video片段有什么问题。

<video poster="sample.jpg" loop autoplay controls muted playsinline> <source type="video/webm" src="sample.webm"></source> <source type="video/mp4" src="sample.mp4"></source> </video> 

video在Safari中没有任何问题(没有testingiOS的早期版本,但我唯一担心的是自动播放问题?),但在Chrome上,我看到的唯一一件事是封面图像和播放button,触发任何东西。 我错过了什么吗? 我真的需要使用JS来实现它吗?

更新:使用iOS Chrome播放Webm文件似乎有问题 – 我已经尝试了几个来自不同位置的文件,他们似乎需要先下载才能播放。

谷歌浏览器目前有一个错误 ,它不会自动播放一个.webmvideo, 如果它在别的之后 。 尝试使用发布的代码: http : //thenewcode.com/777/Create-Fullscreen-HTML5-Page-Background-Video

在这里输入图像说明

如果以前的build议没有帮助,请尝试在Github上使用脚本播放示例( video.js和简单):

https://github.com/videojs/video.js

https://github.com/samdutton/simpl/blob/gh-pages/video/scripted/index.html

另外,请阅读移动浏览器中专门用于静音自动播放的问题:

https://github.com/whatwg/html/issues/976

阅读SOpost也是有用的:

有效检测设备是否播放具有自动播放属性的静音video

我似乎无法find这个video片段有什么问题。

 <video poster="sample.jpg" loop autoplay controls muted playsinline> <source type="video/webm" src="sample.webm"></source> <source type="video/mp4" src="sample.mp4"></source> </video> 

…更新:似乎有一个问题与iOS浏览器玩WebM文件。

最简单也是最好的解决方法是确保先声明mp4文件,然后在第二位声明webm (与您显示的顺序相反)。 我相信iOS预计mp4会成为HTML5video标签中的第一个文件。 所有的iOS看到是src="sample.webm" ,这是不是一个有效的预期的MPEG编解码器,所以导致你的“…播放button,不会触发任何东西” 。 你有一个沉默的错误。

试试:

 <video poster="sample.jpg" loop autoplay controls muted playsinline> <source type="video/mp4" src="sample.mp4"></source> <source type="video/webm" src="sample.webm"></source> </video> 

附注:只是我的意见,但我认为这里的webm是多余的,因为主要支持系统(基于Google的技术)已经可以处理mp4了

最好是在[最终用户]的浏览器中提供这些video解码器,可selectmp4ogv (仅限于Firefox)。

PS:由于SIM数据允许,大多数移动系统的自动播放function被禁用。 最终用户必须select播放该video。 可能有networking上的聪明的解决方法,但请记住,这是预期的行为,所以不是你的当前代码的问题。