Chrome视频自动播放

Question

继Chrome和Firefox的最新更新后,不再支持自动播放视频 - 我尝试在启动时添加一些代码来播放这个但它似乎不起作用？

    var vid = document.getElementById("attractor"); 

    function playVid() { 
        vid.play(); 
    } 

有人找到了解决方法吗？

我们做了很多触摸屏互动,并依靠这种方法为我们的吸引者视频.

Answer 1

自动播放仅在默认情况下将其指定为静音时才有效,如下所示.

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

不用担心,用户可以将视频取消静音,作为html5视频元素的一部分.

Answer 2

我找到了一种如何自动播放视频并避免控制台中出现 js 错误的好方法。

const myVideo = document.getElementById('my-video');

// Not all browsers return promise from .play().
const playPromise = myVideo.play() || Promise.reject('');
playPromise.then(() => {
  // Video could be autoplayed, do nothing.
}).catch(err => {
  // Video couldn't be autoplayed because of autoplay policy. Mute it and play.
  myVideo.muted = true;
  myVideo.play();
});

<video id="my-video" src="https://sample-videos.com/video123/mp4/240/big_buck_bunny_240p_2mb.mp4">

此代码尝试使用声音开始自动播放，如果不可能，那么它将使视频静音并自动播放没有声音的视频。我认为这是一种最佳方式，可以防止 JS 错误。