问题:最近需要用到微信小程序的悬浮后台播放功能,怎么去实现?
解决:
1.启用后台播放配置
app.json文件添加配置:
"requiredBackgroundModes" : ["audio"],
配置图片:
2.添加调用代码
- 注意:getBackgroundAudioManager() 目前只能够播放网络音频链接!不可以播放本地文件、还有工程内的音频文件!
- 想要实现工程内的音频文件后台播放,目前小程序是不支持的,毕竟它就是一个小程序而已,没有App那么强大的功能。不知道后续是否可以支持。
- 测试音频链接,可以去网友的网站,获取音乐平台的音频直链:https://music.liuzhijin.cn/
clkme:function(){
const backgroundAudioManager = wx.getBackgroundAudioManager()
backgroundAudioManager.title = '折子戏';
backgroundAudioManager.epname = '折子戏';
backgroundAudioManager.singer = '许巍';
backgroundAudioManager.coverImgUrl = '';
// 设置了 src 之后会自动播放
backgroundAudioManager.src = 'http://music.163.com/song/media/outer/url?id=97325.mp3';
backgroundAudioManager.play();//不要加这个!!!设置了SRC即可播放,不要再行play()
//播放开始触发onEnded方法
backgroundAudioManager.onPlay(() => {
console.log("音乐播放开始");
})
//播放结束触发onEnded方法
backgroundAudioManager.onEnded(() => {
console.log("音乐播放结束");
})
backgroundAudioManager.onError(() => {
console.log("音乐播放错误");
})
},
3.特别注意一个问题
-
getBackgroundAudioManager 一旦设置了src就开始播放了,不要再次调用play(),否则会导致一些问题!
-
问题:比如你的seek()不管用!你的pause()不管用!
这个点还是有点坑爹的,我们通常不会注意这个问题,今天调试代码老是出问题,最后想是不是src赋值后再次play()的问题呢?
调整了代码以后,pause、play的功能立马正常。