微信小程序中音频播放

如何在小程序中实现音频播放

需要注意几点

1. 由于现在官方不再维护 audio 组件 ，所以音频播放尽可能采取 wx.createInnerAudioContext() 接口 （ 若需要在后台播放，则采用 wx.getBackgroundAudioManager() ）

2. 音频播放，只有在播放时才可以获取到音频长度（参考了多个带音频的小程序 qq音乐，百度网盘等，都是采取自动播放的方式，以获取总时长）

3. 由于 wx.createInnerAudioContext()和wx.getBackgroundAudioManager()接口都差不多，（简单来说，前者只会在当前页面播放，后者可在离开播放页面甚至返回微信界面（需要配置下），继续播放音乐），这里以 背景音乐为例子

4. wx.getBackgroundAudioManager()这个api返回的是一个对象（BackgroundAudioManager），同时需要注意 背景音频播放是获取的 全局唯一的背景音频管理器，也就是说，你不销毁或者停止，他会一直播放（离开微信和配置了后台播放除外）

5. BackgroundAudioManager在这个对象上有一些方法，比如：暂停，设置地址，监听播放状态（播放，停止，暂停，错误。。。。等）

具体操作如下

我使用的是uni-app,但原生小程序也是一样的，调整下生命周期就可以了

1. 获取全局唯一的背景音频管理器

const InnerAudioContext = uni.getBackgroundAudioManager(); 

2. 具体代码如下（此处是封装为播放组件，可直接复制）

3. 效果图如下