近日前端开发某个网页时，需要里面的视频一打开页面就自动播放，通过Js代码 document.getElementById("video041").play(); 时发现谷歌浏览器提示：play() failed because the user didn't interact with the document first. 

该报错是浏览器对于自动播放限制抛出的：play方法调用失败，因为用户没有先操作文档【用户没有先去跟网页做交互再执行音频播放】

原因

谷歌浏览器从2018年1月起就不再自动播放内容了，需要用户手动配置。谷歌浏览器和火狐浏览器为了提高用户体验，减少数据消耗，不支持非静音自动播放。只有当muted autoplay始终被允许才能自动播放没有声音的视频。

解决方法

给video标签加上 muted 属性就可以自动播放了，muted="true"是表示关闭视频声音，静音的意思；

后面又发现在 iOS 上视频还是无法自动播放，一查发现还需要设置 playsinline 属性，添加 playsinline 实现 video 在 iOS 的自动播放。

最终代码 

<video width="550" autoplay muted playsinline loop>
    <source src="video.mp4" type="video/mp4" />
</video>