audio 实现自动音频播放功能
项目中要增加一个报警需求，根据 websocket 返回的列表，进行实时音频报警
听着需求，比较好实现，先做个 demo：
1、下载个音频文件
2、引入html 中调用 play
结果加载后没有自动播放，控制台报了个错误：
查了下原因，大概意思就是：为了防止用户流量偷跑，浏览器在用户交互之前，禁止自动播放音频
ps：用户交互包括（touchend, click, doubleclick 或者是 keydown等）
那就只能引导用户手动点击后再进行报警了，界面增加小喇叭样式的静音按钮，引导用户点击放开声音，这样就可以进行音频报警了
测试代码绑定 body 点击事件以播放音频：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Getting Started</title> </head> <body> <script> let audio = document.createElement('audio'); audio.setAttribute('src', './yisell_sound.mp3'); audio.play(); let body = document.getElementsByTagName('body')[0]; body.setAttribute('style', 'height:' + window.innerHeight + 'px'); body.onclick = function() { audio.play(); };
audio.addEventListener('ended', function () {
console.log('ended');
});
</script> </body> </html>
注意音频路径引用
目前部分主流浏览器都有这个拦截：Chrome、Firefox、Edge
不过 360极速 和 ie 倒是能正常播放
Safari 未测试
