微信小程序-背景音频

微信小程序多音频场景处理 - 背景音频

提到音频播放控制，不得不提背景音频这个方法wx.getBackgroundAudioManager

很不幸，这个有坑。当使用场景为单音频播放或者不需要记录每个音频播放的位置时，使用它是一个合适的选择。当需要记录每个音频的播放位置时，这个就会有些问题了。问题来源backgroundAudioManager.seek这个API。

重要的事情说3遍：backgroundAudioManager.seek在模拟器上正常，但是在真机上不生效，每次都会重新播
重要的事情说3遍：backgroundAudioManager.seek在模拟器上正常，但是在真机上不生效，每次都会重新播
重要的事情说3遍：backgroundAudioManager.seek在模拟器上正常，但是在真机上不生效，每次都会重新播

Component({
  data: {
    play: false,
    list: [
      { id: 1, url: '' },
      { id: 2, url: '' },
      { id: 3, url: '' },
    ],
    duration: {},
    id: null,
  },
  onLoad() {},
  onShow() {},
  onHide() {},
  onUnload() { },
  play() {
    wx.nextTick(() => {
      const { duration = {} } = this.data;
      const currentTime = duration[id] || 0;
      backgroundAudioManager.title = '每日快讯';
      backgroundAudioManager.epname = '';
      backgroundAudioManager.singer = '';
      backgroundAudioManager.coverImgUrl = '';
      backgroundAudioManager.src = url;
      if (currentTime) {
        // 跳转到指定的进度
        backgroundAudioManager.seek(currentTime);
        backgroundAudioManager.play();
      }
    });
  },
  handleAudioPlay(e) {
    const { play, url, id } = e.detail;
    const backgroundAudioManager = wx.getBackgroundAudioManager();
    if (play) {
      backgroundAudioManager.pause();
      // 记录当前音频播放的进度
      wx.getBackgroundAudioPlayerState({
        success(res) {
          const { currentPosition } = res;
          that.setData({
            duration: {
              ...duration,
              [id]: currentPosition,
            },
          });
        },
      });
      // 点击的不是当前播放的音频
      if (this.data.id !== id) {
        this.play()
      }
    } else {
      this.play()
    }
    this.setData({
      play: !play,
      id,
    }),
  },
});

更多微信小程序知识点，查看