BackgroundAudioManager背景音频
1. 属性说明
(1)BackgroundAudioManager类属性
BackgroundAudioManager类为全局唯一的背景音频管理器。可通过API函数wx.getBackgroundAudioManager获取,当小程序切入后台时,如果音频处于播放状态,可以继续播放。但是后台状态不能通过调用API操纵音频的播放状态。
注意:从微信客户端6.7.2版本开始,若需要在小程序切后台后继续播放音频,需要在app.json 中配置 requiredBackgroundModes
属性。开发版和体验版上可以直接生效,正式版还需通过审核。
表【】BackgroundAudioManager类属性名
属性名 |
类型 |
说明 |
src |
string |
音频的数据源(2.2.3 开始支持云文件ID)。默认为空字符串,当设置了新的 src 时,会自动开始播放,目前支持的格式有 m4a, aac, mp3, wav。
扫描二维码关注公众号,回复:
12046143 查看本文章
|
startTime |
number |
音频开始播放的位置(单位:s)。 |
title |
string |
音频标题,用于原生音频播放器音频标题(必填)。原生音频播放器中的分享功能,分享出去的卡片标题,也将使用该值。 |
epname |
string |
专辑名,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值。 |
singer |
string |
歌手名,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值。 |
coverImgUrl |
string |
封面图 URL,用于做原生音频播放器背景图。原生音频播放器中的分享功能,分享出去的卡片配图及背景也将使用该图。 |
webUrl |
string |
页面链接,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值。 |
protocol |
string |
音频协议。默认值为 'http',设置 'hls' 可以支持播放 HLS 协议的直播音频。 |
duration |
number |
当前音频的长度(单位:s),只有在有合法 src 时返回。(只读) |
currentTime |
number |
当前音频的播放位置(单位:s),只有在有合法 src 时返回。(只读) |
paused |
boolean |
当前是否暂停或停止。(只读) |
buffered |
number |
音频已缓冲的时间,仅保证当前播放时间点到此时间点内容已缓冲。(只读) |
(2)BackgroundAudioManager类方法
BackgroundAudioManager所有类方法如表【】所示。
表【】BackgroundAudioManager类方法说明
方法名 |
说明 |
BackgroundAudioManager.play() |
播放音乐 |
BackgroundAudioManager.pause() |
暂停音乐 |
BackgroundAudioManager.seek(number currentTime) |
跳转到指定位置 |
BackgroundAudioManager.stop() |
停止音乐 |
BackgroundAudioManager.onCanplay(function callback) |
监听背景音频进入可播放状态事件。 但不保证后面可以流畅播放 |
BackgroundAudioManager.onWaiting(function callback) |
监听音频加载中事件。当音频因为数据不足,需要停下来加载时会触发 |
BackgroundAudioManager.onError(function callback) |
监听背景音频播放错误事件 |
BackgroundAudioManager.onPlay(function callback) |
监听背景音频播放事件 |
BackgroundAudioManager.onPause(function callback) |
监听背景音频暂停事件 |
BackgroundAudioManager.onSeeking(function callback) |
监听背景音频开始跳转操作事件 |
BackgroundAudioManager.onSeeked(function callback) |
监听背景音频完成跳转操作事件 |
BackgroundAudioManager.onEnded(function callback) |
监听背景音频自然播放结束事件 |
BackgroundAudioManager.onStop(function callback) |
监听背景音频停止事件 |
BackgroundAudioManager.onTimeUpdate(function callback) |
监听背景音频播放进度更新事件,只有小程序在前台时会回调。 |
BackgroundAudioManager.onNext(function callback) |
监听用户在系统音乐播放面板点击下一曲事件(仅iOS) |
BackgroundAudioManager.onPrev(function callback) |
监听用户在系统音乐播放面板点击上一曲事件(仅iOS) |
2. 编码测试
新建backgroundAudio页面,在WXML中添加如下代码:
<!-- demo3.9 backgroundAudio页面 backgroundAudio.wxml-->
<view class='container'>
<view class='page-body'>
< text class='h1'>背景音频BackgroundAudioManager编码测试</ text >
<view class='demo-box'>
<view class="btn-area">
<view class="title">点击下方switch开启或关闭背景音乐</view>
<view class="tc">注意:离开当前页面后背景音乐将保持播放,只有完全关闭小程序才停止(点击右上角胶囊按钮的关闭仍然播放)</view>
设置音乐
<text wx:if="{
{switchStatus}}">开启</text>
<text wx:else>关闭</text>
<switch bindchange="switchChange" checked />
</view>
</view>
</view>
</view>
页面的逻辑处理JS代码如下:
// demo3.9 backgroundAudio页面 backgroundAudio.js
const backgroundAudioManager = wx.getBackgroundAudioManager() //获取背景音频实例
backgroundAudioManager.title = '欢快的背景'
backgroundAudioManager.singer = 'toky'
backgroundAudioManager.coverImgUrl = '' //封面图 URL
// 设置了 src 之后会自动播放(src为云开发中云存储空间文件的链接)
backgroundAudioManager.src = 'https://6465-demo-p9hhp-1300526081.tcb.qcloud.la/toky/
backgroundmusic.mp3?sign=db2895a2030cea0242a274d23354cf04&t=1575194113'
var that = backgroundAudioManager
// 背景音乐循环的方法
// 1、onEnded监听播放自然结束
backgroundAudioManager.onEnded(function() {
// 2、必须重新设置src才能循环之后会自动播放
backgroundAudioManager.src = 'https://6465-demo-p9hhp-1300526081.tcb.qcloud.la/toky/
backgroundmusic.mp3?sign=db2895a2030cea0242a274d23354cf04&t=1575194113'
})
Page({
data: { switchStatus: true },
switchChange: function(e) {
let switchStatus = e.detail.value//获取switch开关状态
this.setData({
switchStatus: switchStatus
})
if (switchStatus) {
backgroundAudioManager.play()//播放
} else {
backgroundAudioManager.pause()//暂停
}
}
})
当然,仅仅使用以上代码这时开发工具中还会提示一个错误,如图【】所示。
图【】开发工具提示需在app.json中进行权限配置
app.json中的requiredBackgroundModes属性是用于配置小程序的后台权限的,其属性值是一个String类型的数组,在app.json中添加如下代码:
"requiredBackgroundModes": [
"audio",
"location"
],
通过真机调试可以看到运行效果如图【】所示。
(a)进入页面默认播放 (b)点开悬浮窗 (c)关闭switch暂停播放 (d)后台播放
图【】BackgroundAudioManager背景音频编码测试