Uniapp使用InnerAudioContext返回内部 audio 上下文 ,获取不到duration当前音频的长度,如何解决?

原因:其实是wx的bug,这个问题在开发环境中,并不会遇到。而是真机测试或发版后,就获取不到duration。

解决:我们只要去手动播放音频后,就会抓取到duration。

代码示例

关键代码

this.audioContext.play(); //手动播放音频

完整代码 

AudioPlay(file) {
				this.audioContext = uni.createInnerAudioContext({
					useWebAudioImplement: true
				});
				this.audioContext.src = file.path;
				this.audioContext.startTime = 0;
				this.audioContext.play(); //手动播放音频
				this.audioContext.stop(); //手动停止播放音频
				this.audioContext.onPlay(() => {
					console.log('开始播放');
				})
                 //调用onCanplay使音频进入可以播放状态
				this.audioContext.onCanplay(() => {
					console.log(_this?.audioContext?.duration, "duration");
					let intervalID = setInterval(() => {
						if (this?.audioContext?.duration !== 0) {
							const time = Math.floor(this.audioContext.duration);
							clearInterval(intervalID); // 清除定时器
                            console.log("当前音频长度",this?.audioContext?.duration, "duration");
							//这里可以做音频的限制
							if ( time > 60) {
								this.audioContext = null;
								uni.showToast({
									icon: "none",
									title: "音频不能超过1分钟",
								});
							} 
						}
					}, 500);
					
				});
			},

<think>好的,我现在需要解决用户的问题,关于如何在uniapp使用innerAudioContext的seek方法来根据指定时间播放音频。首先,我应该回顾一下用户提供的引用内容,特别是引用[1],因为那里提到了video组件的seek方法,可能和audio的类似。 用户的问题涉及innerAudioContext,而不是videoContext,但两者可能有相似的方法。根据引用[1],videoContext有play、pause和seek方法,所以推测innerAudioContext可能也有类似的方法。不过需要确认uniapp的官方文档是否支持innerAudioContext的seek方法。 接下来,用户需要的是使用示例,所以我要提供一个代码示例,展示如何创建innerAudioContext实例,设置音频源,然后调用seek方法跳转到指定时间,并播放。同时,需要注意可能的兼容性问题,比如某些平台不支持seek,或者需要正确的文件路径。 引用[2]提到临时路径的问题,所以在示例中可能需要提醒用户如果使用临时路径,需要保存文件以便下次使用。不过在这个问题中,用户主要关注的是如何根据时间播放,所以可能不需要深入讨论文件保存,但可以简要提及。 引用[3]提到使用ref获取dom节点的问题,但这个问题和音频播放无关,可能暂时不需要考虑。但需要注意在uniapp使用API的正确方式,避免类似问题。 然后,我需要确保代码语法正确,比如使用uni.createInnerAudioContext()来创建实例,正确调用seek方法,并在合适的时机调用play。同时,处理可能的事件监听,如onCanplay,以确保音频准备好后再执行seek和play。 还要考虑错误处理,比如平台兼容性,iOS和Android的不同表现,以及网络音频和本地音频的区别。需要提醒用户注意事项,如部分平台不支持seek,或者需要预加载音频。 最后,生成相关问题,帮助用户进一步了解相关功能,比如性能分析、优化方法和应用场景,但要根据innerAudioContext的特性来设计问题,比如预加载、事件处理、暂停和恢复播放等。</think>在 uniapp使用 `innerAudioContext` 实现指定时间播放音频,可通过 `seek` 方法实现。以下是具体实现步骤和示例代码: ### 一、基础用法 ```javascript // 创建音频实例 const audio = uni.createInnerAudioContext(); // 设置音频源(支持网络/本地路径) audio.src = 'https://example.com/audio.mp3'; // 监听音频可播放事件 audio.onCanplay(() => { // 跳转到第30秒(单位:秒) audio.seek(30); // 开始播放 audio.play(); }); // 启动音频加载(必须调用) audio.autoplay = false; audio.play(); // 触发加载后立即暂停 audio.pause(); ``` ### 二、带状态检测的进阶版 ```javascript let isSeeking = false; audio.onCanplay(() => { if (!isSeeking) { audio.seek(120); // 跳转到2分钟处 isSeeking = true; audio.play(); } }); // 错误处理 audio.onError((err) => { console.error('音频播放错误:', err.errMsg); }); ``` ### 三、平台注意事项 1. **微信小程序**:需在 `onCanplay` 后执行 seek,且要求音频为 **MP3/WAV** 格式[^1] 2. **H5端**:部分浏览器不支持精确跳转 3. **本地文件**:推荐使用 `uni.downloadFile` 下载后再播放[^2] ```javascript // 本地文件示例 uni.downloadFile({ url: 'https://example.com/audio.mp3', success: (res) => { audio.src = res.tempFilePath; } }); ``` ### 四、关键API说明 | 方法 | 说明 | 触发时机 | |-------------|-----------------------------|----------------------| | seek(time) | 跳转到指定时间(秒) | 需在音频可播放状态后调用 | | play() | 开始/继续播放 | 可在任意状态调用 | | pause() | 暂停播放 | 播放状态下有效 |
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值