微信小程序播放音乐代码

您好，我可以为您提供微信小程序播放音乐的代码示例：

1. 在wxml文件中添加一个audio标签，如下所示：

<audio src="{{musicUrl}}" poster="{{poster}}" name="{{name}}" author="{{author}}" binderror="audioError" bindended="audioEnded" bindtimeupdate="audioUpdate" bindplay="audioPlay" bindpause="audioPause"></audio>

2. 在js文件中定义需要用到的变量和方法，如下所示：

Page({
  data: {
    musicUrl: 'http://xxx.com/xxx.mp3', // 音乐地址
    poster: 'http://xxx.com/xxx.jpg', // 封面图片
    name: '歌曲名称', // 歌曲名
    author: '歌手名', // 歌手名
    isPlaying: false, // 是否正在播放
    progress: 0, // 播放进度，单位：秒
    duration: 0 // 音乐总时长，单位：秒
  },

  onLoad: function () {
    // 监听音乐播放事件
    wx.onBackgroundAudioPlay(() => {
      this.setData({
        isPlaying: true
      })
    })

    // 监听音乐暂停事件
    wx.onBackgroundAudioPause(() => {
      this.setData({
        isPlaying: false
      })
    })

    // 监听音乐停止事件
    wx.onBackgroundAudioStop(() => {
      this.setData({
        isPlaying: false,
        progress: 0
      })
    })

    // 监听音乐播放进度更新事件
    wx.onBackgroundAudioTimeUpdate(() => {
      const duration = Math.floor(wx.getBackgroundAudioManager().duration) // 获取音乐总时长
      const progress = Math.floor(wx.getBackgroundAudioManager().currentTime) // 获取播放进度
      this.setData({
        duration,
        progress
      })
    })
  },

  // 播放/暂停按钮点击事件
  togglePlay() {
    if (this.data.isPlaying) {
      wx.pauseBackgroundAudio()
    } else {
      wx.playBackgroundAudio({
        dataUrl: this.data.musicUrl,
        title: this.data.name,
        coverImgUrl: this.data.poster
      })
    }
  },

  // 拖动进度条事件
  changeProgress(e) {
    const progress = e.detail.value
    wx.seekBackgroundAudio({
      position: progress
    })
  }
})

注意：为了保证音乐可以在后台播放，需要在app.json文件中添加如下配置：

"requiredBackgroundModes": ["audio"]