uni.createInnerAudioContext() @createinneraudiocontext

展示全部

# uni.createInnerAudioContext()

创建并返回 audio 上下文 audioContext 对象 GitCode GitHub

注意

使用完后，必须调用destory方法将资源进行释放

支持格式

格式	Android	iOS	HarmonyOS
mp3	√	√	√
mp4	√	√	x
m4a	√	√	√
wav	√	√	√
aac	√	√	√
flac	√	√	x
aiff	x	√	x
amr	√	x	√
ape	√	x	x
caf	x	√	x
ogg	√	x	√
wma	√	x	x

web平台的支持取决于浏览器的实现，一般浏览器上述音频格式均支持
小程序平台支持的格式见各家小程序的文档
HarmonyOS 平台使用 AudioPlayer 实现

缓存说明

App-Android 平台播放的网络音频，默认会缓存到应用cache目录的uni-audio文件夹下，默认大小为100M，超过后会根据最近最少使用的缓存算法自动进行清除；
4.51 版本以上 App-iOS 平台支持Cache功能，缓存路径、默认大小和自动清理机制和 Android 一样；

# createInnerAudioContext 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 返回值

类型

InnerAudioContext

名称类型必备默认值兼容性描述

duration

number

是

当前音频的长度（单位：s），只有在当前有合法的 src 时返回

currentTime

number

是

当前音频的播放位置（单位：s），只有在当前有合法的 src 时返回

paused

boolean

是

当前是是否暂停或停止状态，true 表示暂停或停止，false 表示正在播放

src

string

是

音频的数据链接，用于直接播放

startTime

number

是

音频开始播放的位置（单位：s）

buffered

number

是

音频缓冲的时间点，仅保证当前播放时间点到此时间点内容已缓冲

autoplay

boolean

是

false

是否自动开始播放，默认 false

loop

boolean

是

false

是否循环播放，默认 false

obeyMuteSwitch

boolean

是

是否遵循系统静音开关，当此参数为 false 时，即使用户打开了静音开关，也能继续发出声音，默认值 true

volume

number

是

音量。范围 0~1。

playbackRate

number

否

1.0

播放的倍率。可取值： 0.5/0.8/1.0/1.25/1.5/2.0，默认值为1.0。（仅 App 支持）

cache

boolean

是

是否缓存线上音频资源，默认值为true，当设置false时，不会缓存资源到本地，直播地址需要主动设置为false

referrerPolicy

string

否

需要基础库： 2.13.0

origin: 发送完整的referrer; no-referrer: 不发送。格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html，其中 {appid} 为小程序的 appid，{version} 为小程序的版本号，版本号为 0 表示为开发版、体验版以及审核版本，版本号为 devtools 表示为开发者工具，其余为正式版本；

# InnerAudioContext 的方法

# pause(): void;

暂停

# pause 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# stop(): void;

停止

# stop 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# play(): void;

播放

# play 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# seek(position: number): void;

跳转到指定位置，单位 s

# seek 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
position	number	是	-	-	-

# destroy(): void;

销毁当前实例

# destroy 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	-	4.33	4.33	4.41	4.41	4.61

# onCanplay(callback: (result: any) => void): void;

音频进入可以播放状态，但不保证后面可以流畅播放

# onCanplay 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onPlay(callback: (result: any) => void): void;

音频播放事件

# onPlay 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	-	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onPause(callback: (result: any) => void): void;

音频暂停事件

# onPause 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onStop(callback: (result: any) => void): void;

音频停止事件

# onStop 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onEnded(callback: (result: any) => void): void;

音频自然播放结束事件

# onEnded 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onTimeUpdate(callback: (result: any) => void): void;

音频播放进度更新事件

# onTimeUpdate 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onError(callback: (result: ICreateInnerAudioContextFail) => void): void;

音频播放错误事件

# onError 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: ICreateInnerAudioContextFail) => void	是	-	-	-

# ICreateInnerAudioContextFail 的属性值

名称

类型

必备

默认值

兼容性

描述

errCode

number

是

错误码

合法值

兼容性

描述

1107601

系统错误

1107602

网络错误

1107603

文件错误

1107604

格式错误

1107605

未知错误

1107609

播放路径不能为空

errSubject

string

是

统一错误主题（模块）名称

data

any

否

错误信息中包含的数据

cause

Error

否

源错误信息，可以包含多个错误，详见SourceError

errMsg

string

是

# onWaiting(callback: (result: any) => void): void;

音频加载中事件，当音频因为数据不足，需要停下来加载时会触发

# onWaiting 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onSeeking(callback: (result: any) => void): void;

音频进行 seek 操作事件

# onSeeking 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# onSeeked(callback: (result: any) => void): void;

音频完成 seek 操作事件

# onSeeked 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offCanplay(callback: (result: any) => void): void;

取消监听 onCanplay 事件

# offCanplay 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offPlay(callback: (result: any) => void): void;

取消监听 onPlay 事件

# offPlay 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offPause(callback: (result: any) => void): void;

取消监听 onPause 事件

# offPause 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offStop(callback: (result: any) => void): void;

取消监听 onStop 事件

# offStop 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offEnded(callback: (result: any) => void): void;

取消监听 onEnded 事件

# offEnded 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offTimeUpdate(callback: (result: any) => void): void;

取消监听 onTimeUpdate 事件

# offTimeUpdate 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offError(callback: (result: ICreateInnerAudioContextFail) => void): void;

取消监听 onWaiting 事件

# offError 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: ICreateInnerAudioContextFail) => void	是	-	-	-

# offWaiting(callback: (result: any) => void): void;

取消监听 onWaiting 事件

# offWaiting 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	-	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offSeeking(callback: (result: any) => void): void;

取消监听 onSeeking 事件

# offSeeking 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# offSeeked(callback: (result: any) => void): void;

取消监听 onSeeked 事件

# offSeeked 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.33	4.33	4.41	4.41	4.61

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(result: any) => void	是	-	-	-

# 参见

# 示例

hello uni-app x

该 API 不支持 Web，请运行 hello uni-app x 到 App 平台体验

<template>
	<!-- #ifdef APP -->
	<scroll-view style="flex: 1;">
	<!-- #endif -->
		<view class="uni-padding-wrap">
			<page-head title="audio"></page-head>
			<view class="uni-common-mt">
				<slider ref="slider" :value="position" :min="0" :max="duration" @changing="onchanging"
					@change="onchange"></slider>
			</view>
			<view class="uni-title">
				<text class="uni-title-text">属性示例</text>
			</View>
			<text class="uni-text-box uni-common-mt">当前音频播放位置（保留小数点后 3 位）：{{currentTime}} s</text>
			<text class="uni-text-box">音频的长度（单位:s）：{{duration}} s</text>
			<text class="uni-text-box">当前是否停止状态：{{isPaused}}</text>
			<text class="uni-text-box">音频缓冲的时间点：{{buffered}} s</text>
			<text class="uni-text-box">当前音量：{{volume}}</text>
			<button plain :disabled="volume == 1" @click="increaseVolume">增加音量</button>
			<button plain :disabled="volume == 0" @click="decreaseVolume">减少音量</button>

			<text class="uni-subtitle-text uni-title">开始播放的位置（单位：s）</text>
			<input :value="startTime" type="number" placeholder="开始播放的位置（单位：s）" class="uni-input"
				@input="startTimeInput"></input>
			<boolean-data :defaultValue="false" title="是否自动开始播放" @change="setAutoplay"></boolean-data>
			<boolean-data :defaultValue="false" title="是否循环播放" @change="setLoop"></boolean-data>
			<text class="uni-subtitle-text uni-title"
				style="padding-left: 10px;padding-top: 10px;padding-right: 10px;">播放倍率(Web/HarmonyOS 不支持)</text>
			<radio-group class="uni-flex uni-row radio-group" @change="playbackRateChange"
				style="flex-wrap: wrap;padding: 10px;">
				<radio value="0.5" style="margin-right: 3px">0.5
				</radio>
				<radio value="0.8" style="margin-right: 3px">0.8</radio>
				<radio value="1.0" style="margin-right: 3px" :checked="playbackRateChecked">1.0</radio>
				<radio value="1.25" style="margin-right: 3px">1.25</radio>
				<radio value="1.5" style="margin-right: 3px">1.5</radio>
				<radio value="2.0">2.0</radio>
			</radio-group>

			<view class="uni-title">
				<text class="uni-title-text">方法示例</text>
			</View>
			<button :disabled="isPlaying" @click="play" class="uni-btn">播放</button>
			<button :disabled="!isPlaying" @click="pause" class="uni-btn">暂停</button>
			<button :disabled="!isPlaying" @click="stop" class="uni-btn">停止</button>
			<button @click="onchangeValue(20)" class="uni-btn">跳转到指定位置20</button>
			<button @click="onTimeUpdate" class="uni-btn">onTimeUpdate</button>
			<button @click="offTimeUpdate" class="uni-btn">offTimeUpdate</button>
			<button @click="onWaiting" class="uni-btn">onWaiting</button>
			<button @click="offWaiting" class="uni-btn">offWaiting</button>


			<text style="color: red;font-size: 15px;margin-top: 10px;">tip:销毁后请重新进入此界面再播放</text>
			<button @click="destory" class="uni-btn">销毁</button>

			<view class="uni-title">
				<text class="uni-title-text">格式/路径示例</text>
			</View>
			<navigator url="/pages/API/create-inner-audio-context/inner-audio-format" class="uni-btn">
				<button @click="pause">音频格式示例</button>
			</navigator>
			<navigator url="/pages/API/create-inner-audio-context/inner-audio-path" class="uni-btn">
				<button @click="pause">音频路径示例</button>
			</navigator>
			<navigator url="/pages/API/create-inner-audio-context/inner-audio-mult" class="uni-btn">
				<button @click="pause">多音频同时播放</button>
			</navigator>
		</view>
	<!-- #ifdef APP -->
	</scroll-view>
	<!-- #endif -->
</template>
<script lang="uts">
	const audioUrl = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3'
	export default {
		data() {
			return {
				title: "innerAudioContext",
				currentTime: 0,
				duration: 100,
				startTime: 0,
				buffered: 0,
				volume: 0.5,
				isCanplay: false,
				isPlaying: false,
				isPaused: true,
				isPlayEnd: false,
				_isChanging: false,
				_audioContext: null as InnerAudioContext | null,
				// 自动化测试
				onSeekingTest: false,
				onSeekedTest: false,
				onWaitingTest: false,
				playbackRateChecked: true,
				onTimeUpdateCb: (res : any) => { },
				onWaitingCb: (res : any) => { }
			}
		},
		computed: {
			position() {
				return this.isPlayEnd ? 0 : this.currentTime;
			},
		},
		onReady() {
			this._audioContext = uni.createInnerAudioContext();
			this._audioContext!.src = audioUrl;
			this.volume = this._audioContext!.volume;
			this.onCanplay()
			this._audioContext!.onPlay(() => {
				this.isPaused = false;
				this.isPlaying = true;
				console.log('开始播放', this.isPaused);
			});

			this.onTimeUpdateCb = (res : any) => {
				if (this._isChanging) { return; }
				this.currentTime = this._audioContext!.currentTime;
				this.buffered = this._audioContext!.buffered;
				console.log('onTimeUpdateCb', this.currentTime)

				// #ifdef MP
				// 微信小程序安卓端过早的时机获取的buffered、duration为0，改为在此处获取
				if(this._audioContext!.duration === 0) {
					this.buffered = this._audioContext!.buffered;
					this.duration = this._audioContext!.duration
				}
				// #endif
				if (this.currentTime > this.buffered) {
					console.log('缓冲不足');
				}
			};

			this.onWaitingCb = (res : any) => {
				console.log('音频加载中事件');
				this.onWaitingTest = true
			}

			this.onTimeUpdate()
			// this.onWaiting()
			this.onError()
			this.onEnded()
		},
		onUnload() {
			if (this._audioContext != null) {
				if (this.isPlaying) {
					this.stop();
				}
				this._audioContext!.destroy()
			}
		},
		methods: {
			onCanplay() {
				this._audioContext!.onCanplay(() => {
					console.log('音频进入可以播放状态事件');
					this.isCanplay = true;
					// #ifdef MP
					// 微信小程序安卓端过早的时机获取的volume为undefine，改为在此处获取
					this.volume = this._audioContext!.volume;
					// #endif
					// 当音频可以播放时，获取缓冲信息
					this.buffered = this._audioContext!.buffered;
					this.duration = this._audioContext!.duration
				});
			},
			onchanging() {
				this._isChanging = true;
			},
			onchange(e : UniSliderChangeEvent) {
				let pos = e.detail.value;
				console.log('pos', pos);
				this.onSeeking()
				this.onSeeked()
				this._audioContext!.seek(pos);
				this._isChanging = false;
			},
			onchangeValue(pos : number) {
				this.onSeeking()
				this.onSeeked()
				this._audioContext!.seek(pos);
				this._isChanging = false;
			},
			startTimeInput(e : UniInputEvent) {
				let startTimeValue = parseInt(e.detail.value)
				this._audioContext!.startTime = startTimeValue;
				this.onchangeValue(startTimeValue)
			},
			setAutoplay() {
				this._audioContext!.autoplay = !this._audioContext!.autoplay;
				console.log(this._audioContext!.autoplay, 'autoplay');
			},
			setLoop() {
				this._audioContext!.loop = !this._audioContext!.loop;
				console.log(this._audioContext!.loop, 'loop');
			},
			play() {
				if (!this.isCanplay) {
					uni.showToast({
						title: '音频未进入可以播放状态，请稍后再试',
						icon: 'error'
					});
					return;
				}
				this.isPlaying = true;
				this._audioContext!.play();
				this.isPlayEnd = false;
				if (this._audioContext!.startTime > 0) {
					this.onchangeValue(this._audioContext!.startTime)
				}
			},
			onSeeking() {
				this._audioContext!.onSeeking(() => {
					console.log('音频进行 seek 操作事件');
					this.onSeekingTest = true
				});
			},
			onSeeked() {
				this._audioContext!.onSeeked(() => {
					console.log('音频完成 seek 操作事件');
					this.onSeekedTest = true
				});
			},
			onWaiting() {
				this._audioContext!.onWaiting(this.onWaitingCb);
			},
			offWaiting() {
				this._audioContext!.offWaiting(this.onWaitingCb);
			},
			onTimeUpdate() {
				this._audioContext!.onTimeUpdate(this.onTimeUpdateCb);
			},
			offTimeUpdate() {
				this._audioContext!.offTimeUpdate(this.onTimeUpdateCb);
			},
			increaseVolume() {
				this.volume = Math.min(this.volume + 0.1, 1);
				this.volume = parseFloat(this.volume.toFixed(1));
				this._audioContext!.volume = this.volume
				console.log('增加音量', this.volume);
			},
			decreaseVolume() {
				this.volume = Math.max(this.volume - 0.1, 0);
				this.volume = parseFloat(this.volume.toFixed(1));
				console.log('减少音量', this.volume);
				this._audioContext!.volume = this.volume
			},
			onEnded() {
				this._audioContext!.onEnded(() => {
					console.log('播放结束');
					this.currentTime = 0;
					this.startTime = 0
					this.isPlaying = false;
					this.isPaused = true;
					this.isPlayEnd = true;
					(this.$refs["slider"] as UniSliderElement).value = 0
				});
			},
			onError() {
				this._audioContext!.onError((err) => {
					console.log('err', err);
					this.isPlaying = false;
					this.isPaused = true;
				});
			},
			pause() {
				this._audioContext!.onPause(() => {
					console.log('音频暂停事件');
					this.isPaused = true;
				});
				this._audioContext!.pause();
				this.isPlaying = false;
			},
			stop() {
				console.log('stop');
				this._audioContext!.onStop(() => {
					// 第一次点停止时，不触发
					this.isPaused = true;
					console.log('音频停止事件');
				});
				this._audioContext!.stop();
				this.isPlaying = false;
				console.log('stop', this.isPaused);
			},
			destory() {
				if (this._audioContext != null) {
					this.isPlaying = false;
					this._audioContext!.destroy()
				}
			},
			playbackRateChange(e : UniRadioGroupChangeEvent) {
				// if (this._audioContext != null && this.isPlaying) {
					console.log(parseFloat(e.detail.value))
					this._audioContext!.playbackRate = parseFloat(e.detail.value)
				// }
			},
      //just for test
      setSrc(src:string){
        if(	this._audioContext!=null){
          this._audioContext!.src = src
        }
      }
		}
	}
</script>
<style>
	.play-time-area {
		display: flex;
		flex-direction: row;
		margin-top: 20px;
	}

	.duration {
		margin-left: auto;
	}

	.play-button-area {
		display: flex;
		flex-direction: row;
		justify-content: center;
		margin: 50px 0;
	}

	.icon-play {
		width: 60px;
		height: 60px;
	}
</style>