uniapp实现小程序或App录音功能

小程序或app实现录音功能，uniapp官网自带的有方法，比较简单。

参考官方文档的API 根据API调试一下就可以

官方文档也有相应的示例 uni.getRecorderManager() | uni-app官网 (dcloud.net.cn)

录音功能uniapp文档

平台差异说明

App	H5	微信小程序	支付宝小程序	百度小程序	抖音小程序、飞书小程序	QQ小程序	快手小程序	京东小程序
√	x	√	√	√	√	√	√	√

获取全局唯一的录音管理器 recorderManager

方法	参数	说明	平台差异说明
start	options	开始录音
pause		暂停录音	App 暂不支持
resume		继续录音	App 暂不支持
stop		停止录音
offStop	callback	取消监听录音停止事件	仅支付宝小程序支持
onStart	callback	录音开始事件
offStart	callback	移除录音开始事件	仅支付宝小程序支持
onPause	callback	录音暂停事件
offPause	callback	移除监听录音暂停事件	仅支付宝小程序支持
onStop	callback	录音停止事件，会回调文件地址
onResume	callback	监听录音继续事件	仅小程序支持
offResume	callback	取消监听录音继续事件	仅支付宝小程序支持
onInterruptionBegin	callback	监听录音因为受到系统占用而被中断开始事件。以下场景会触发此事件：微信语音聊天、微信视频聊天、QQ语音聊天、QQ视频聊天、电话响铃、接听电话。此事件触发后，录音会被暂停。pause 事件在此事件后触发	微信小程序、百度小程序、QQ小程序、快手小程序
onInterruptionEnd	callback	监听录音中断结束事件。在收到 interruptionBegin 事件之后，小程序内所有录音会暂停，收到此事件之后才可再次录音成功。	微信小程序、百度小程序、QQ小程序、快手小程序
onFrameRecorded	callback	已录制完指定帧大小的文件，会回调录音分片结果数据。如果设置了 frameSize ，则会回调此事件	App 暂不支持
offFrameRecorded	callback	取消监听已录制完指定帧大小的文件事件，指定 frameSize 大小并且 format 参数设置为 mp3 格式，调用此接口才会有回调	仅支付宝小程序支持
onDecibelChange	callback	监听声音分贝变化事件，详见	仅支付宝小程序支持
offDecibelChange	callback	取消监听声音分贝变化事件，详见	仅支付宝小程序支持
onError	callback	录音错误事件, 会回调错误信息
offError	callback	取消监听录音错误事件	仅支付宝小程序支持

示例代码：

<template>
	<view>
		<button @tap="startRecord">开始录音button>
		<button @tap="endRecord">停止录音button>
		<button @tap="playVoice">播放录音button>
	view>
template>

const recorderManager = uni.getRecorderManager();
const innerAudioContext = uni.createInnerAudioContext();
 
innerAudioContext.autoplay = true;
 
export default {
	data() {
		return {
			text: 'uni-app',
			voicePath: ''
		}
	},
	onLoad() {
		let self = this;
		recorderManager.onStop(function (res) {
			console.log('recorder stop' + JSON.stringify(res));
			self.voicePath = res.tempFilePath;
		});
	},
	methods: {
		startRecord() {
			console.log('开始录音');
 
			recorderManager.start();
		},
		endRecord() {
			console.log('录音结束');
			recorderManager.stop();
		},
		playVoice() {
			console.log('播放录音');
 
			if (this.voicePath) {
				innerAudioContext.src = this.voicePath;
				innerAudioContext.play();
			}
		}
	}
}

大家可以自行测试一下