小程序停止html5音乐,微信小程序-音乐播放器+背景播放

需求描述：

1.正常播放音频

2.可以滑动进度条

3.可以切换上一条，下一条音频

4.退出当前页或关闭小程序之后仍然可以正常播放

5.试听功能进入该播放页不可以播放上一条，下一条

6.退出该页面或小程序之后，再次回到该页面，播放条自动到当前播放进度

图二图三是关闭小程序之后微信页面的展示，可以通过悬浮关闭该音频。

⚠️ 使用小程序 BackgroundAudioManager，需要在 app.json配置相关参数

"requiredBackgroundModes": [

"audio"

]

代码

{ {music.start}}

{ {music.leave}}

// pages/audioPlayer/audioPlayer.js

const api = require('../../service/http.js');

const util = require('../../utils/util.js')

var App = getApp()

const bgMusic = App.bgMusic //创建背景音乐

Page({

/**

* 页面的初始数据

*/

data: {

isTry: null, // 是否是试听状态

idx: 0, // 当前音频(第一个-上一条按钮不能点击，最后一条，下一条按钮不能点击)

albumCode: '', // 当前音频标识

opusName: '', // 当前专辑名字

musicSrc: '',

singler: '', // 当前作者

audioMsg: {}, // 音频信息(作者，封面，名字--仅展示)

opusSalt: '', // 当前音频id

isEnd: false, // 最后一条音频结束时控制

endVideoTime: '', // 最后一条音频时长

isPlay: true, // 是否暂停音乐

isStop: false, // 是否停止音乐

slideLen: 0, // 进度条初始值

music: { // 音频信息--用来处理数据

start: '00:00',

leave:'',

long: '',

length: ''

},

hasPre: true, // 是否有上一条音频

hasNxt: true, // 是否有下一条音频

musicList: [], // 用来存储音频列表，存储到本地，点击上一条、下一条音频时，不调用接口

perMusicMsg: {}, // 进入页面之后，就将上一条音频，下一条音频信息提取出来，方便直接点击按钮

nxtMusicMsg: {}, // 同上

isStopSlider: false // 是否停止滚动条随着音频播放改变长度 -- 防止拖动滚动条时发生回退现象！！！

},

/**

* 生命