从基础库 1.6.0 开始,本接口停止维护,请使用 wx.createInnerAudioContext 代替
微信小程序插件:支持
功能描述
播放音频。
AudioContext 实例,可通过 wx.createAudioContext 获取。
AudioContext 通过 id 跟一个 audio 组件绑定,操作对应的 audio 组件。
设置音频地址
播放音频。
暂停音频。
跳转到指定位置。
<!-- audio.wxml -->
<audio src="{{src}}" id="myAudio" ></audio>
<button type="primary" bindtap="audioPlay">播放</button>
<button type="primary" bindtap="audioPause">暂停</button>
<button type="primary" bindtap="audio14">设置当前播放时间为14秒</button>
<button type="primary" bindtap="audioStart">回到开头</button>
// audio.js
Page({
onReady (e) {
// 使用 wx.createAudioContext 获取 audio 上下文 context
this.audioCtx = wx.createAudioContext('myAudio')
this.audioCtx.setSrc('http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46')
this.audioCtx.play()
},
data: {
src: ''
},
audioPlay () {
this.audioCtx.play()
},
audioPause () {
this.audioCtx.pause()
},
audio14 () {
this.audioCtx.seek(14)
},
audioStart () {
this.audioCtx.seek(0)
}
})
微信小程序插件:不支持
微信 Windows 版:支持
微信 Mac 版:支持
返回一个 Float32Array,其中包含了带有频道的 PCM 数据,由频道参数定义(0 代表第一个频道)
要获取特定通道数据的索引
示例代码
const audioCtx = wx.createWebAudioContext()
const myArrayBuffer = audioCtx.createBuffer(2, frameCount, audioCtx.sampleRate);
const nowBuffering = myArrayBuffer.getChannelData(channel);
微信小程序插件:不支持
微信 Windows 版:支持
微信 Mac 版:支持
从指定数组中复制样本数据到 audioBuffer 的指定通道
需要复制的源数组
需要复制到的目标通道编号
复制的偏移数据量
示例代码请参考 AudioBuffer.copyFromChannel
微信小程序插件:不支持
微信 Windows 版:支持
微信 Mac 版:支持
从AudioBuffer的指定频道复制到数组终端。
示例代码
const audioCtx = wx.createWebAudioContext()
wx.request({
url: 'xx.mp3', // 音频 url
responseType: 'arraybuffer',
success: res => {
audioCtx.decodeAudioData(res.data, audioBuffer => {
const channels = audioBuffer.numberOfChannels;
const frameCount = audioCtx.sampleRate * 2.0;
const anotherArray = new Float32Array(frameCount);
const rate = audioBuffer.sampleRate
const startOffset = 0
const endOffset = rate * 3;
const newAudioBuffer = audioCtx.createBuffer(channels,endOffset - startOffset,rate)
const offset = 0
for (let channel = 0; channel < channels; channel++) {
audioBuffer.copyFromChannel(anotherArray, channel, startOffset);
console.log('copyFromChannel 成功')
newAudioBuffer.copyToChannel(anotherArray, channel, offset);
}
}, err => {
console.error('decodeAudioData fail', err)
})
}
})
基础库 2.19.0 开始支持,低版本需做兼容处理。
AudioBuffer 接口表示存在内存里的一段短小的音频资源,利用 WebAudioContext.decodeAudioData 方法从一个音频文件构建,或者利用 WebAudioContext.createBuffer 从原始数据构建。把音频放入 AudioBuffer 后,可以传入到一个 AudioBufferSourceNode 进行播放。
存储在缓存区的 PCM 数据的采样率(单位为 sample/s)
返回存储在缓存区的 PCM 数据的采样帧率
返回存储在缓存区的 PCM 数据的时长(单位为秒)
储存在缓存区的 PCM 数据的通道数
返回一个 Float32Array,包含了带有频道的 PCM 数据,由频道参数定义(有 0 代表第一个频道)
从 AudioBuffer 的指定频道复制到数组终端。
从指定数组复制样本到 audioBuffer 的特定通道
从基础库 1.6.0 开始,本接口停止维护,请使用 wx.createInnerAudioContext 代替
微信小程序插件:支持,需要微信小程序基础库版本不低于 1.9.6
创建 audio 上下文 AudioContext 对象。
audio 组件的 id
在自定义组件下,当前组件实例的this,以操作组件内 audio 组件
基础库 1.6.0 开始支持,低版本需做兼容处理。
微信小程序插件:支持,需要微信小程序基础库版本不低于 1.9.6
微信 Windows 版:支持
微信 Mac 版:支持
微信 鸿蒙 OS 版:支持
创建内部 audio 上下文 InnerAudioContext 对象。
| 属性 | 类型 | 默认值 | 必填 | 说明 | 最低版本 |
|---|---|---|---|---|---|
| useWebAudioImplement | boolean | false | 否 | 是否使用 WebAudio 作为底层音频驱动,默认关闭。对于短音频、播放频繁的音频建议开启此选项,开启后将获得更优的性能表现。由于开启此选项后也会带来一定的内存增长,因此对于长音频建议关闭此选项。 | 2.19.0 |
const innerAudioContext = wx.createInnerAudioContext({
useWebAudioImplement: false // 是否使用 WebAudio 作为底层音频驱动,默认关闭。对于短音频、播放频繁的音频建议开启此选项,开启后将获得更优的性能表现。由于开启此选项后也会带来一定的内存增长,因此对于长音频建议关闭此选项
})
innerAudioContext.src = 'https://wx_test.mp3'
innerAudioContext.play() // 播放
innerAudioContext.pause() // 暂停
innerAudioContext.stop() // 停止
innerAudioContext.destroy() // 释放音频资源
基础库 2.13.0 开始支持,低版本需做兼容处理。
微信小程序插件:支持
创建媒体音频播放器对象 MediaAudioPlayer 对象,可用于播放视频解码器 VideoDecoder 输出的音频。
// 创建视频解码器,具体参数见 createVideoDecoder 文档
const videoDecoder = wx.createVideoDecoder()
// 创建媒体音频播放器
const mediaAudioPlayer = wx.createMediaAudioPlayer()
// 启动视频解码器
videoDecoder.start()
// 启动播放器
mediaAudioPlayer.start().then(() => {
// 添加播放器音频来源
mediaAudioPlayer.addAudioSource(videoDecoder).then(res => {
videoDecoder.getFrameData() // 建议在 requestAnimationFrame 里获取每一帧视频数据
console.log(res)
})
// 移除播放器音频来源
mediaAudioPlayer.removeAudioSource(videoDecoder).then()
// 停止播放器
mediaAudioPlayer.stop().then()
// 销毁播放器
mediaAudioPlayer.destroy().then()
// 设置播放器音量
mediaAudioPlayer.volume = 0.5
})