小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
音频文件
在uni-app中使用到音频的情况还是有,最最可能的就是开发一个带有社交功能的app,语音聊天就在所难免了,而如果设计到多平台的话,各个平台对语音的支持不一,也就导致开放方式不一样了,这里就简单的聊一聊几个平台中,对于音频文件的处理。
微信浏览器
uni-app有一个自带的音频管理器:uni.getRecorderManager()
this.recorderManager = uni.getRecorderManager();
this.recorderManager.start({
sampleRate: 16000,
numberOfChannels: 2,
encodeBitRate: 60000,
format: 'mp3'
});
因为这个是官方的文档,所以就不过多阐述了,可以跟着文档走。
但是这是有个问题。
在兼容性中可以看到,最热门的APP,微信小程序可以正常使用,但是H5中是不支持的。
这时候就需要使用到第三方库了。
// #ifdef H5
import Recorder from 'recorder-core/recorder.min';
// #endif
this.recorder = Recorder({
type: 'mp3',
sampleRate: 16000,
bitRate: 16, //mp3格式,指定采样率hz、比特率kbps,其他参数使用默认配置;注意:是数字的参数必须提供数字,不要用字符串;需要使用的type类型,需提前把格式支持文件加载进来,比如使用wav格式需要提前加载wav.js编码引擎
onProcess: function(buffers, powerLevel, bufferDuration, bufferSampleRate, newBufferIdx, asyncEnd) {
//录音实时回调,大约1秒调用12次本回调
//可利用extensions/waveview.js扩展实时绘制波形
//可利用extensions/sonic.js扩展实时变速变调,此扩展计算量巨大,onProcess需要返回true开启异步模式
}
});
这里就使用到了一个Recorder的录音库了。
作者本人为了避免大家上手困难有详细的代码实例可以看看哦,实际使用的话也只是很小的改动一部分代码即可轻松运用了。