顺晟科技
2022-09-25 07:35:22
144
页面上有一个弹框,弹框放了一个 audio
标签,然后通过消息推送,如果有推送过来的信息有异常错误,则弹框提示,并且自动播放报警声音。
<audio
loop="loop"
preload="auto"
ref="warningAudio"
autoplay
muted
>
<source src="./assets/mp3/警报.mp3" type="audio/mp3">
</audio>
如果有异常,则显示弹框,并且播放声音
handleOpenVoice() {
this.is_stop = false
this.$refs.warningAudio.play()
},
现在的问题是,弹框显示了,但是执行 this.$refs.warningAudio.play()
报错了,没有播放声音,关闭该弹框,第二来错误信息,显示弹框,才能自动播放声音,查了一下,说是chrome
阻止自动播放了,有什么办法处理呢 ?
现在的浏览器会禁用音视频的自动播放,直到用户操作之后。所以可以在项目启动后做一个Dialog组件请求用户打开自动播放声音,当用户点击之后后续的音频就可以自动播放了。具体的操作思路可以看一下这款VSC的插件
29
2022-11
09
2022-11
09
2022-11
19
2022-10
19
2022-10
18
2022-10