最近做了一个项目,里面有一个客服模块,需要添加一个消息提示声音,实现过程如下:
首先需要在页面嵌入一个消息提示声音的audio标签,软后用js控制声音的播放,每次来消息的时候就触发一次,代码如下:
<!-- 聊天消息提示音 -->
<audio id="msgNoticeMusic" controls="controls" >
<source src="/kefu_static/mp3/notice.mp3">
</audio>
<!-- 聊天消息提示音 -->
<script>
console.log("播放音乐开始");
$('#msgNoticeMusic')[0].play();
console.log("播放音乐开始结束");
</script>
另外我的另外一端是用的uniapp,用户接收到消息也需要触发消息提示声音,代码如下:
<script>
let noticeMp3 = uni.createInnerAudioContext();
noticeMp3.src = "/static/mp3/notice.mp3";
noticeMp3.play();
</script>
执行过程就是初始化一个音频播放对象,设置播放音频的路径,下面就执行播放音频的方法就好了,当然还有其他更多的控制,可以参考uniapp的官方文档。