1、下载插件 npm i js-audio-recorder
2
、html部分
<template>
<div class="Home" style="margin: 1vw">
<Button type="success" @click="getPermission()" style="margin: 1rem">获取麦克风权限</Button>
<Button type="info" @click="startRecorder()" style="margin: 1rem">开始录音</Button>
<Button type="info" @click="stopRecorder()" style="margin: 1rem">停止录音</Button>
<Button type="success" @click="playRecorder()" style="margin: 1rem">录音播放</Button>
</div>
</template>
3、script部分
import Recorder from "js-audio-recorder";
const recorder = new Recorder({
// 采样位数,支持 8 或 16,默认是16
sampleBits: 16,
// 采样率,支持 11025、16000、22050、24000、44100、48000,根据浏览器默认值,
// 我的chrome是48000
sampleRate: 48000,
// 声道,支持 1 或 2, 默认是1
numChannels: 1,
// 是否边录边转换,默认是false
compiling: false,(0.x版本中生效,1.x增加中)
});
methods: {
//PC端录制语音
getPermission() {
Recorder.getPermission().then(
() => {
alert("获取权限成功");
},
(error) => {
console.log(`${error.name} : ${error.message}`);
}
);
},
//开始录音
startRecorder() {
recorder.start().then(
() => {},
(error) => {
console.log(`${error.name} : ${error.message}`);
}
);
},
// 继续录音
resumeRecorder() {
recorder.resume();
},
// 暂停录音
pauseRecorder() {
recorder.pause();
},
// 结束录音
stopRecorder() {
recorder.stop();
},
// 录音播放
playRecorder() {
recorder.stop();
recorder.play();
}
}
注意:现有版本以及所有低版本(四个版本)都存在 报错 "MPEGMode is not defined" 。
解决方法:在发布新版本之前,您需要编辑文件node_modules/lamejs夹中的相应文件。
1、Lame.js:29
Encoder.js:112
PsyModel.js:162
都需要
var MPEGMode = require('./MPEGMode.js');
2、BitStream.js:33
Presets.js:18
都需要
var Lame = require('./Lame.js');
3、QuantizePVT.js:54
需要
var BitStream = require('./BitStream.js');