H5移动端如何自动播放视频

由于自动播放网页中的音频或视频会给用户带来困扰或不必要的流量消耗,所以苹果系统和安卓系统通常都会禁止自动播放和使用JS的触发播放,必须由用户来触发才播放;解决方法思路:先通过用户touchstart触碰触发播放并暂停(让音频开始加载),后面用JS再操作就没问题了;解决代码:

在mounted生命周期钩子函数中可以写：

document.addEventListener('touchstart', function () {
    document.getElementsByTagName('audio')[0].play();
      document.getElementsByTagName('video')[0].play();
      // 4秒之后关闭视频和音频
    setTimeout(()=>{
       document.getElementsByTagName('audio')[0].pause();
    document.getElementsByTagName('video')[0].pause();
    )
},4000);