时间戳

首页 > 解决方案 > google 自动播放限制的解决方法

javascript - google 自动播放限制的解决方法

问题描述

我了解谷歌限制了谷歌浏览器上视频和音频功能的自动播放，并且在播放音频之前需要用户交互。
但是，当我悬停图像时，我的应用程序需要播放音频。

我尝试创建一个不可见的按钮并在我的事件上模仿一个点击@mousehover事件。

我是这样做的：

<audio id="myaudio" muted="true" style="display:none">
    <source src="some_audio_source" type="audio/*" /> <!--  -->
</audio>

<button id="fake-btn" style="display: hidden"></button>

<div @mousehover="playAud('myaudio')>
   <img src="some_iamge_source> 
</div>

playAud(audid) {
    document.getElementById('fake-btn').click();
    const curAud = document.getElementById(audid);
    curAud.play();
}

但是，错误Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first仍然存​​在。

这些限制有什么解决方法吗？

标签： javascriptvue.jsgoogle-chromehtml5-audioautoplay

解决方案

推荐阅读