创建audioManager.js作为全局播放管理工具,代码如下
// 创建一个全局的音频管理对象,用于存储音频相关状态和方法 const audioManager = { // 背景音频管理器实例 // #ifdef H5 bgAudioManager: uni.createInnerAudioContext(), // #endif // #ifdef APP-PLUS bgAudioManager: uni.getBackgroundAudioManager(), // #endif // 当前音频播放状态,true表示播放中,false表示暂停 isPlaying: false, // 当前音频的相关信息,例如标题、作者、封面等,可根据实际需求扩展 currentIndex: 0, currentAudioInfo: { musicTitle: '', musicImgPath: '', musicFilePath: '' , musicDuration: 0 }, currentDuration: 0, playType: 0, // 默认 0 播放1 2 暂停 timingDs: 0, timing: 0, timingIndex: 0, // 定时关闭 timingArr: [ {title: '60分钟', value: 3600}, {title: '45分钟', value: 2700}, {title: '30分钟', value: 1800}, {title: '15分钟', value: 900}, {title: '1分钟-测试', value: 60}, {title: '关闭', value: 0}, ], // 音乐列表 musicArr: [], loopType: 0, // 循环模式 0 单曲循环 1 列表循环 // 初始化音频管理器,设置一些默认的监听事件等 init() { this.bgAudioManager.onPlay(() => { this.isPlaying = true; this.playType = 1; // 可以在这里添加其他逻辑,比如更新页面上的播放状态图标等 }); this.bgAudioManager.onPause(() => { this.isPlaying = false; this.playType = 2; // 相应页面状态更新逻辑 }); this.bgAudioManager.onStop(() => { this.isPlaying = false; this.playType = 0; // 可能的清理或重置逻辑 }); this.bgAudioManager.onEnded(() => { // this.isPlaying = false; // this.playType = 0; // 比如自动播放下一首等逻辑(需进一步实现) if(this.loopType == 0) { // 单曲循环 audioManager.play(this.currentAudioInfo) } else { // 列表循环 if (this.currentIndex == this.musicArr.length - 1) { this.currentIndex = 0; } else { this.currentIndex ++; } audioManager.play(this.musicArr[this.currentIndex]) } }); this.bgAudioManager.onTimeUpdate(() => { // 获取当前播放进度,单位为秒 this.currentDuration = this.bgAudioManager.currentTime > 0 ? this.bgAudioManager.currentTime : this.currentDuration; // this.progressPercent = (this.currentTime / this.duration) * 100; // console.log('当前播放进度:', this.currentTime); }); }, // 播放音频方法,传入音频信息对象 play(audioInfo) { // this.currentAudioInfo = audioInfo; console.log("进来了~1") this.currentDuration = 0; this.currentAudioInfo = { musicTitle: audioInfo.musicTitle, musicImgPath: audioInfo.musicImgPath, musicFilePath: audioInfo.musicFilePath, musicDuration: audioInfo.musicDuration } this.bgAudioManager.title = audioInfo.musicTitle; this.bgAudioManager.coverImgUrl = audioInfo.musicImgPath; this.bgAudioManager.singer = audioInfo.musicTitle; this.bgAudioManager.src = audioInfo.musicFilePath; this.bgAudioManager.play(); }, play1() { console.log("进来了~2") let audioInfo = this.currentAudioInfo; this.bgAudioManager.title = audioInfo.musicTitle; this.bgAudioManager.coverImgUrl = audioInfo.musicImgPath; this.bgAudioManager.singer = audioInfo.musicTitle; this.bgAudioManager.src = audioInfo.musicFilePath; this.bgAudioManager.seek(this.currentDuration); this.bgAudioManager.play(); }, // 暂停音频播放 pause() { this.bgAudioManager.pause(); }, // 停止音频播放并重置相关状态 stop() { this.bgAudioManager.stop(); this.isPlaying = false; this.currentAudioInfo = { musicTitle: '', musicImgPath: '', musicFilePath: '' , musicDuration: 0 }; this.currentDuration = 0; this.playType = 0; this.musicArr = []; this.currentIndex = 0; clearInterval(this.timingDs) }, // 定时关闭 timeOutBtn(val,inx) { this.timing = val; this.timingIndex = inx; if (this.timing == 0) { clearInterval(this.timingDs) return; } clearInterval(this.timingDs) this.timingDs = setInterval(() => { if (this.timing > 0) { this.timing -- } else { clearInterval(this.timingDs) audioManager.stop(); this.timingDs = 0; this.timing = 0; this.timingIndex = 0; } },1000) }, // 更新循环模式 loopTypeBtn() { this.loopType = this.loopType == 0 ? 1 : 0; if (this.loopType == 0) { uni.showToast({ title: '已切换为单曲循环', icon: 'none', duration: 2000 }); } else { uni.showToast({ title: '已切换为列表循环', icon: 'none', duration: 2000 }); } }, // 更新当前音乐列表 upListBtn(arr,index) { this.musicArr = arr; this.currentIndex = index; }, // 上一首 preBtn() { if (this.currentIndex == 0) { uni.showToast({ title: '已经第一首了', icon: 'none', duration: 2000 }); return; } this.currentIndex --; audioManager.play(this.musicArr[this.currentIndex]) }, // 下一首 nextBtn() { if (this.currentIndex == this.musicArr.length - 1) { uni.showToast({ title: '已经最后一首了', icon: 'none', duration: 2000, }); return; } this.currentIndex ++; audioManager.play(this.musicArr[this.currentIndex]) }, }; // 初始化音频管理器 audioManager.init(); // 导出音频管理对象,方便在其他页面引入使用 export default audioManager;
在需要使用播放器的页面,引入
import audioManager from '@/common/audioManager.js';
就可以使用播放器管理工具了