在浏览器加载完毕后，自动播放视频：出现play() failed because the user didn't interact with the document first.错误

最新推荐文章于 2024-08-09 14:49:25 发布

又起风了

最新推荐文章于 2024-08-09 14:49:25 发布

阅读量3.1w

点赞数 3

分类专栏：前端 video视频播放

本文链接：https://blog.csdn.net/pan_xi_yi/article/details/103390504

版权

video视频播放同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

前端

1 篇文章 0 订阅

订阅专栏

问题：test.html:30 Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>


        <video controls width="250" id="videoTest" autoplay playsinline >

    <source src="https://interactive-examples.mdn.mozilla.net/media/examples/flower.webm"
            type="video/webm">

    <source src="https://interactive-examples.mdn.mozilla.net/media/examples/flower.webm"
            type="video/mp4">

    Sorry, your browser doesn't support embedded videos.
</video>

        <script>

  var videoTest = document.getElementById('videoTest');
  videoTest.play();
        </script>
    </body>
</html>

解决方法：给video标签加入<video muted></video> 静音即可。

Chrome 66为了避免标签产生随机噪音。