需求背景:微信小程序内添加背景音乐,进行全局控制播放与暂停
创建全局背景音乐
app.js
// app.js
App({
onLaunch() {
this.initAudeo();
},
globalData: {
innerAudioContext: "",
audioSrc: "", // 音频地址
},
// 初始化音频信息
initAudeo() {
this.globalData.innerAudioContext = wx.createInnerAudioContext();
this.globalData.innerAudioContext.autoplay = true;
this.globalData.innerAudioContext.src = this.globalData.audioSrc;
this.globalData.innerAudioContext.loop = true;
},
// 播放事件
audioPlay() {
this.globalData.innerAudioContext.play();
},
// 暂停事件
audioPause() {
this.globalData.innerAudioContext.pause();
},
});
业务脚本js使用举例
const app = getApp(); // 引用全局公共js
Page({
data: {},
onReady() {},
onLoad(options) {},
// 播放事件
audeoPlay() {
app.audioPlay();
},
// 暂停事件
audioPause() {
app.audioPause();
},
});
功能依托于微信小程序内置的 wx.createInnerAudioContext() 方法,相关更多方式使用可参考官方文档。
官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/media/audio/InnerAudioContext.html
简单记录如有问题或更优解还请不要吝啬的分享出来,此结。