【也不知道为什么，发出来的代码就被折叠了，大家复制出来放到代码编辑器里看吧。】
最近在开发一个小功能，需要播放音频，音频需要循环播放，代码如下：
onReady() {
const audio = wx.createInnerAudioContext()
audio.src = 'http://downsc.chinaz.net/Files/DownLoad/sound1/201906/11582.mp3' audio.loop = true audio.onPlay(() => { console.log('audio play start') }) audio.onTimeUpdate(() => { console.log('audio info', audio.duration, audio.currentTime) }) audio.play() },
上面这段代码执行之后，onTimeUpdate里的log没有输出到控制台上。
查询之后发现，在官方社区里，有许多关于onTimeUpdate的问题。
由于音频加载导致 onUpdateTime 失效
由此，小改动一下代码, 将play放到onCanPlay事件里去执行，就可以了。
audio.onCanPlay(()=>{
audio.play()
})
经过改动以后，我们会发现在第一轮播放完毕之后，onTimeUpdate之后就不再执行了。
原因分析，第二轮播放onTimeUpdate出现问题应该和之前分析的类似。第二次播放在JS引擎里也需要一个准备时间，但在loop模式下，第二轮的准备时间没准备好，就触发了音频播放，导致onTimeUpdate没能成功触发。
解决第二轮播放，执行onTimeUpdate的方式为：
1. loop 改为false
2. 添加onEnded事件监听，在onEnded事件， 先将播放进度设置回0， 再执行一下播放代码。通过再次播放，实现视频循环播放的功能。
最终调整后的代码如下：
{
onReady() { const audio = wx.createInnerAudioContext() audio.src = 'http://downsc.chinaz.net/Files/DownLoad/sound1/201906/11582.mp3' audio.loop = true audio.onPlay(() => { console.log('audio play start') }) audio.onTimeUpdate(() => { console.log('audio info', audio.duration, audio.currentTime) }) audio.onEnded(() => { audio.seek(0) audio.onCanplay(() => { audio.play() }) }) this.audio = audio },
playaudio() { this.audio.play() },}
多说一句： 微信小程序里这种小bug真多，又长时间不解决。
参考资料:
