我想播放音频作为警报,但我得到了一个错误,如“未捕获(promise)DOMExc0019: play()失败,因为用户没有首先与文档交互。
HTML代码:
<audio id="alarm" src="alarm.mp3"></audio>
JavaScript代码:
function alarm() {
var value = document.getElementById("rvoltage").innerHTML;
if (value > 230) {
document.getElementById('alarm').play();
}
}
这是因为许多浏览器不允许超文本标记语言元素在页面加载时自动播放音乐和视频,以节省带宽等。你可以创建一个按钮,在点击事件上播放音乐,或者绕过它,让它在你页面上的任何点击事件上播放。
如果:用户已与域交互(单击、点击等),则允许自动播放声音。在桌面上,用户的媒体参与度指数阈值已经超过,这意味着用户以前播放过声音视频。在手机上,用户已[将网站添加到其主屏幕]。
https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
只需在HTML中添加mute
属性:
<audio id="alarm" src="alarm.mp3" muted></audio>
在JS中,只要在播放音频后取消静音即可。
function alarm() {
var value = document.getElementById("rvoltage").innerHTML;
if (value > 230) {
document.getElementById('alarm').play();
document.getElementById('alarm').muted = false;
}
}
我没有测试这个代码,但我认为,根据新政策,它应该工作得很好。
您可以从这里获得自动播放策略的详细信息:https://developers.google.com/web/updates/2017/09/autoplay-policy-changes