uni-app 音频组件控制API在H5端无法获取duration长度 获取结果仍为NAN

uni-app 音频组件控制API在H5端无法获取duration长度 获取结果仍为NAN

开发环境 版本号 项目创建方式
Windows win10 HBuilderX

操作步骤：

const innerAudioContext = uni.createInnerAudioContext();  
innerAudioContext.onPlay(() => {
console.log('开始播放了------star' + _self.recorindex);  
var realVal = innerAudioContext.duration;  
});

预期结果：

正常的数字：

实际结果：

NAN

bug描述：

uni.createInnerAudioContext();    
参数：duration;  
duration    Number  当前音频的长度（单位：s），只有在当前有合法的 src 时返回  
在H5端获取仍为NAN  
无法正常取得正确的最大长度。

更多关于uni-app 音频组件控制API在H5端无法获取duration长度 获取结果仍为NAN的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

duration需要在onCanplay中获取。

更多关于uni-app 音频组件控制API在H5端无法获取duration长度 获取结果仍为NAN的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在H5端获取音频duration为NaN的问题，通常是由于音频元数据尚未加载完成导致的。以下是解决方案：

  1. 使用onCanplay事件替代onPlay：
const innerAudioContext = uni.createInnerAudioContext();
innerAudioContext.onCanplay(() => {
  console.log('音频可播放，duration:', innerAudioContext.duration);
});
  1. 确保音频源有效且可访问：
  • 检查音频URL是否正确
  • 确认服务器支持跨域访问(CORS)
  • 使用绝对路径而非相对路径
  1. 添加错误处理：
innerAudioContext.onError((err) => {
  console.error('音频错误:', err);
});
  1. 对于网络音频，可能需要预加载：
innerAudioContext.autoplay = false;
innerAudioContext.src = 'your-audio-url';
innerAudioContext.play(); // 在onCanplay触发后再调用
回到顶部