Vue录音

使用方式

npm

安装: npm i js-audio-recorder
调用:在需要录音的地方引入

import Recorder from 'js-audio-recorder'

let recorder = new Recorder()

API

 1 // 开始录音
 2 
 3 recorder.start();
 4 
 5 // 暂停录音
 6 
 7 recorder.pause();
 8 
 9 // 继续录音
10 
11 recorder.resume()
12 
13 // 结束录音
14 
15 recorder.stop();
16 
17 // 录音播放
18 
19 recorder.play();
20 
21 // 销毁录音实例,释放资源,fn为回调函数,
22 
23 recorder.destroy(fn);
24 
25 recorder = null;
26 
27 下载功能
28 
29 // 下载pcm文件
30 
31 recorder.downloadPCM();
32 
33 // 下载wav文件
34 
35 recorder.downloadWAV();
36 
37 // 重命名pcm文件,wav也支持
38 
39 recorder.downloadPCM('重命名');
40 
41 获取录音时长
42 
43 // 回调持续输出时长
44 
45 recorder.onprocess = function(duration) {
46 
47   console.log(duration);
48 
49 }
50 
51 // 手动获取录音时长
52 
53 console.log(recorder.duration);

使用示例:

 1 <template>
 2   <div class="home">
 3     <h1 @click="handleclick()">开始录音</h1>
 4     <h1 @click="handleclickl()">继续录音</h1>
 5     <h1 @click="handleclicks()">结束录音</h1>
 6     <h1 @click="handleclickp()">录音播放</h1>
 7   </div>
 8 </template>
 9 
10 <script>
11 import Recorder from 'js-audio-recorder'
12 let recorder = new Recorder()
13 export default {
14   name: 'home',
15   methods: {
16     handleclick () {
17       console.log(1)
18       recorder.start()// 开始录音
19     },
20     handleclickl () {
21       console.log(2)
22       recorder.resume()// 继续录音
23     },
24     handleclickt () {
25       console.log(3)
26       recorder.stop() // 结束录音
27     },
28     handleclickb () {
29       console.log(4)
30       recorder.play() // 录音播放
31     }
32   }
33 }
34 </script>

本文转载自:https://www.cnblogs.com/lljun/p/11535807.html

猜你喜欢

转载自www.cnblogs.com/qinzeiqinwang/p/hhh11.html