Question

我使用此代码制作视频（例如横幅，因此没有控件）自动播放并永远循环播放。

<video id="video1" class="video-js vjs-default-skin"
      controls width="900" height="500"
      poster="myposter.jpg"
      data-setup='{
        "controls": false,
        "loop": "true",
        "autoplay": true, 
        "preload": "true"}'>
         <source src="thisismyvideoyay.webm" type='video/webm' />
    </video>

它在我的电脑上工作正常，但在我的手机上（Android OS 4.2.2与Chrome），它不是自动播放或预加载，而是在完成后不循环。

我在Video.js页面上看到了这个：

自动：立即开始加载视频（如果浏览器同意）。一些 iPhone和iPad等移动设备不会预装视频为了保护用户的带宽。这就是价值的原因称为'auto'，而不是像'true'那样的最终结果。

我将preload设置为true但它仍然没有自动播放或循环。

这是我的浏览器的一项功能，我该如何避免？

我试过其他浏览器：

UC浏览器似乎根本不支持HTML5？
Stock浏览器显示一个小视频图标，但也不显示播放器
↑与Maxthon相同↑

Answer 1

要解决iOS上的自动播放问题，请勿使用videojs 选项自动播放视频。

换句话说，这不起作用：

videojs('my-video-id', {
    "autoplay": true
});

这也不会：

videojs('my-video-id').ready(function() {
    this.play();
});

而是等待视频对象加载，然后触发播放操作：

echo

Answer 2

在手机上，你无法让它循环或预装数据。但我确实有一个解决方案，你可以自动播放它。你可以在这里使用我的代码= http://www.andy-howard.com/recreate-bbc-iplayer/index.html

只需在文档上添加一个附加点击功能即可。这将使手机上的浏览器点击图像，然后图像又将数据标签转换为视频标签，然后转换为videojs播放器，然后播放：）

希望这有帮助。

Answer 3

在移动设备上，如果添加muted选项

，则可以自动播放

<video autoplay muted>
  <source src="video.webm" type="video/webm" />
  <source src="video.mp4" type="video/mp4" />
</video>

Chrome v53：https://developers.google.com/web/updates/2016/07/autoplay

iOS 10：https://webkit.org/blog/6784/new-video-policies-for-ios

Answer 4

这对我有用，可以在视频标签上使用

data-setup ='{“控件”：false，“ autoplay”：true，“ preload”：“ auto”，“ loop”：true}'

Answer 5

player.ready(function() {
  setTimeout(function() {
     player.play();
  }, 1000);
});

Video.js - 自动播放和循环无法在手机上工作

5 个答案: