网页audio标签中autoplay自动播放音乐失败解决方案

这几天写了一个网页，想给网页加一个背景音乐，随着页面加载好自动播放，一直实现不了，也没有报错，后来查询资料原来是因为audio设置的autoplay属性，记录一下。

原本

<audio preload autoplay loop id="music">
     <source src="/music/bg.mp3" type="audio/mpeg">
</audio>

Chrome提示：DOMException: play() failed because the user didn’t interact with the document first.

原因：

Chrome等浏览器基于安全的策略，于早几年就已经停止自动播放

解决方法：

进入页面随便点击一下页面，这样用户和浏览器就产生了交互，可以开启自动播放

<script type="text/javascript">
    window.onload = function(){
             setInterval("toggleSound()",1);
        }

    function toggleSound() {
                var music = document.getElementById("music");//获取ID  
                if (music.paused) { //判读是否播放  
                    music.paused=false;
                    music.play(); //没有就播放 
                }    
        }
</script>

如果该文章对你有帮助的话，请留下一个赞👍把。