uni-app 使用innerAudioContext API 小程序返回的duration是0或者是nan或者是无限大

uni-app 使用innerAudioContext API 小程序返回的duration是0或者是nan或者是无限大

开发环境 版本号 项目创建方式
Windows win10 专业版 HBuilderX 
产品分类：uniapp/小程序/微信

PC开发环境操作系统：Windows

HBuilderX类型：正式

HBuilderX版本号：3.1.13

第三方开发者工具版本号：1.05.2104092

基础库版本号：1.05.2104092

项目创建方式：HBuilderX

### 示例代码：
```javascript
//监听停止录音事件，并把路径保存到数据 这个是nan
this.recorderManager.onStop((res)=> {
APP.commom.uploadFile(res.tempFilePath)
.then(res => {
that.innerAudioContext.src = res;
setTimeout(()=>{
console.log(that.innerAudioContext);
that.time = that.getMinute(that.innerAudioContext.duration);
})
that.innerAudioContext.onError((res) =>{
console.log(res.errMsg);
console.log(res.errCode);
});
}).catch(err =>{
console.log(err)
});
}
)

//监听停止录音事件，并把路径保存到数据 这个是什么都获取不到
this.recorderManager.onStop((res)=> {
APP.commom.uploadFile(res.tempFilePath)
.then(res => {
that.innerAudioContext.src = res;
that.$nextTick(() =>{
that.innerAudioContext.onPlay(()=>{
console.log(that.innerAudioContext);
that.time = that.getMinute(that.innerAudioContext.duration);
})
that.innerAudioContext.onError((res) =>{
console.log(res.errMsg);
console.log(res.errCode);
});
})
}).catch(err =>{
console.log(err)
});
}
)

操作步骤：

http://kfb021.wx.wygoo.com/public/upload/applet/20210811/ec62ac5fdb6ab42d00a10df69116c804.aac
这个是文件位置

预期结果：

可以直接获取到duration不是0也不是nan

实际结果：

使用innerAudioContext api 小程序返回的duration是0或者是nan或者是无限大

bug描述：

录音获取的音频放到音频播放的api里面duration返回的是nan或者是

Image


更多关于uni-app 使用innerAudioContext API 小程序返回的duration是0或者是nan或者是无限大的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 使用innerAudioContext API 小程序返回的duration是0或者是nan或者是无限大的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个常见的音频元数据加载问题。innerAudioContext 的 duration 属性需要在音频元数据加载完成后才能正确获取。

问题在于你尝试在设置 src 后立即获取 duration，此时音频文件尚未完成加载和解析。以下是解决方案：

  1. 使用 onCanplay 事件：
that.innerAudioContext.onCanplay(() => {
  console.log('音频可以播放了，duration:', that.innerAudioContext.duration);
  that.time = that.getMinute(that.innerAudioContext.duration);
});
  1. 完整示例代码：
this.recorderManager.onStop((res) => {
  APP.commom.uploadFile(res.tempFilePath)
    .then(res => {
      that.innerAudioContext.src = res;
      
      // 监听音频可以播放事件
      that.innerAudioContext.onCanplay(() => {
        console.log('音频元数据已加载，duration:', that.innerAudioContext.duration);
        that.time = that.getMinute(that.innerAudioContext.duration);
      });
      
      // 错误处理
      that.innerAudioContext.onError((err) => {
        console.log('播放错误:', err.errMsg, err.errCode);
      });
    })
    .catch(err => {
      console.log(err);
    });
});
回到顶部