1. 程式人生 > >微信小程式背景音樂開發

微信小程式背景音樂開發

wx.getBackgroundAudioManager() 背景音樂

wx.getBackgroundAudioManager() 

推薦大家使用背景音樂不在使用audio

audio播放音訊載入時間長 體驗需求達不到

相關文件

相關程式碼


const bgMusic = wx.getBackgroundAudioManager()  //建立背景音樂
Page({

  data: {
    id: '',//請求資料引數id
    picMsg: {},//接收資料物件
  },
 
  onLoad: function (options) {
    var that = this
    that.setData({
      id: options.id,
    })
    that.getPicInfo() //請求伺服器
  }, 
  // 開始播放
  listenerButtonPlay: function (src) {
    var that = this
    console.log(src)
    bgMusic.src = src;
    bgMusic.onTimeUpdate(() => {  //監聽音訊播放進度
      console.log(bgMusic.currentTime)
    })
    bgMusic.onEnded(() => {  //監聽音樂自然播放結束
      console.log("音樂播放結束");
      that.listenerButtonPlay(that.data.picMsg.mp3)
    })
    bgMusic.play(); //播放音樂
  },
  getPicInfo() {
    var that = this
    wx.request({
      url: 'https://xxxxx.xxxxx.com/1.json?id=' + that.data.id,
      header: {
        'content-type': 'application/json'
      },
      method: 'GET',
      success: function (res) {
        that.listenerButtonPlay(res.data.data.mp3) //成功回撥執行播放音樂
        that.setData({
          picMsg: res.data.data, //賦值物件
        })

      }
    })
  },

  onUnload() {
    var that = this
    that.listenerButtonStop()//頁面解除安裝時停止播放
    console.log("離開")
  },
 
  //暫停
  audioPause: function () {
    var that = this
    bgMusic.pause(); //暫停播放音樂
    console.log('暫停')
  },
  audioPlay: function () {
    var that = this
    bgMusic.play(); //停止播放
    console.log('繼續播放')
  },
  //停止播放
  listenerButtonStop: function () {
    bgMusic.stop()
  },
})