微信小程序音频播放失败:TypeError: Cannot read property ‘duration‘ of undefined

报错截图

最下面这个this.setData()报错可不用理会,是this取值的问题

解决

  1. 需要播放和暂停功能时,需要把audio以及他的src放在Page外面。
  2. 不能缺少 audioCtx.onPlay() 和 audioCtx.onError()两个方法,且需要放在play()方法之前
  3. 如果在wx.createInnerAudioContext()添加了 {useWebAudioImplement:true},把它去掉。
javascript 复制代码
//需要播放暂停音频功能时,需要将这两个变量放在 Page()上面
let audioCtx=wx.createInnerAudioContext()
audioCtx.src='http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3' //填入你自己的音频链接
Page({
     data: {
          isPlay: false,
     },
     playMusic(){
          audioCtx.onPlay(()=>{
               console.log("开始播放");
          })
           audioCtx.onError((res)=>{
             wx.showToast({
                title: '音乐播放错误',
                icon: 'error',
                duration: 3000
              })
           })
           let isPlay = !this.data.isPlay //控制播放和暂停的变量
           this.setData({
                isPlay:isPlay
               })
          if(isPlay){
               audioCtx.play()
               audioCtx.loop = true;
          }else{
               audioCtx.pause()
          }
     },
     },
     onLoad() {
          this.playMusic(); //加载完毕,开始播放
     },
});
相关推荐
海兰10 小时前
【文字三国志:第六篇】天命重构,UI组件设计细节
人工智能·ui·语言模型·小程序
CCC:CarCrazeCurator13 小时前
Diffusion Transformer(DiT):原理、与 U-Net 对比及在视频生成中的深度应用
人工智能·音视频·transformer
草根站起来13 小时前
微信小程序request net:ERR_CERT_DATE_INVALID
微信小程序·小程序
小北的AI科技分享15 小时前
广州小程序平台推荐:2026年本地商家数字化选型深度测评
小程序·广州小程序平台
MageGojo16 小时前
10 种主题随机诗词:一个 API 解决小程序的诗词内容源
python·小程序·古诗词·api 接入
山楂树の16 小时前
Video核心术语
学习·音视频
青山科技分享16 小时前
2026北京小程序平台推荐——本地商家数字化选型全维度解析
小程序·小程序平台推荐
醒醒该学习了!17 小时前
AI生成视频与数字人
人工智能·音视频
ThinkPet18 小时前
记事-vue3项目整合Agora声网sdk实现RTC视频通话
vue.js·音视频·实时音视频
liyunlong-java19 小时前
Android 跳转系统相册选取图片/视频/音频/文档(适配全版本权限)
android·gitee·音视频