实现以下功能:

1、检测当前音频环境,是否支持录音(WebAudio Api);

2、获取输入、输出设备列表,获取电脑默认的音频设备;

3、试音功能,通过分析录音样本数据,判断是否录到声音;

4、实时监听录音过程,根据样本片段展示录音音波;

5、实时监听音频设备变化,有设备插入或拔出时给出相应反馈;

6、生成wav文件;

7、支持转换为mp3格式,由于是同步转换,所有可按场景需要,使用webworker或创建子进程来异步转换。

说明:

1、最近项目实在太忙,抽不出时间好好梳理整个流程,又怕时间过去太久忘了,简单记录一下(从博客内容也看得出来);

2、项目也是匆匆整理的,删掉了业务相关的东西,只留下了整体的逻辑,跑起来、实现以上功能是没问题的,但代码看起来就有点糙了,如果参考使用,需要根据具体业务再细化、优化;

3、有不清楚的可以直接提issue,新任务又到了,估计不会再细化博客内容了。

项目地址:https://github.com/luohao8023/recorder-electron-vue,develop分支

Electron-vue中通过WebAudioApi实现录音功能,并转换为mp3格式,实时监测音频设备变化的更多相关文章

  1. matlab中datest() 将日期和时间转换为字符串格式

    来源:https://ww2.mathworks.cn/help/matlab/ref/datestr.html?searchHighlight=datestr&s_tid=doc_srcht ...

  2. vue中使用axios post上传头像/图片并实时显示到页面

    在前端开发中,为了更好的用户体验,在头像上传时会先将图片显示到页面然后点击保存按钮 完成图片的上传成功 代码部分有参考他人的写法. html代码:   <div id="myPhoto ...

  3. vue中watched属性

    watched属性,vue中的观察属性,可用来监听一个值的变化 默认有两个参数,新值,旧值 data (){ return { currentCity: "深圳" } } watc ...

  4. Android中使用MediaCodec硬件解码,高效率得到YUV格式帧,快速保存JPEG图片(不使用OpenGL)(附Demo)

    MediaCodec的使用demo: https://github.com/vecio/MediaCodecDemo https://github.com/taehwandev/MediaCodecE ...

  5. 手把手教Electron+vue的使用

    .现如今前端框架数不胜数,尤其是angular.vue吸引一大批前端开发者,在这个高新技术快速崛起的时代,自然少不了各种框架的结合使用.接下来是介绍electron+vue的结合使用. 2.Elect ...

  6. 从零开始搭建Electron+Vue+Webpack项目框架,一套代码,同时构建客户端、web端(一)

    摘要:随着前端技术的飞速发展,越来越多的技术领域开始被前端工程师踏足.从NodeJs问世至今,各种前端工具脚手架.服务端框架层出不穷,“全栈工程师”对于前端开发者来说,再也不只是说说而已.在NodeJ ...

  7. 【原创】从零开始搭建Electron+Vue+Webpack项目框架,一套代码,同时构建客户端、web端(二)

    摘要:上篇文章说到了如何新建工程,并启动一个最简单的Electron应用.“跑起来”了Electron,那就接着把Vue“跑起来”吧.有一点需要说明的是,webpack是贯穿这个系列始终的,我也是本着 ...

  8. 手把手教你创建electron+vue项目

    electron可以结合前端的很多框架来进行快速的开发.在这里只讲一种electron结合vue并且使用前端的elementui来快速搭建一个项目页面. 第一步.创建electron 以管理员身份运行 ...

  9. electron+vue实现菜单栏

    公司开发的产品都是用c++写的,而且还都是几个人,老板想搞下创新,就是看看能否通过其它的方式来实现前后端分离.然后我就了解到了electron这个东西,之前学安卓的时候看到过flutter,不经意间看 ...

随机推荐

  1. Nginx流控

    流量限制(rate-limiting),是Nginx中一个非常实用,却经常被错误理解和错误配置的功能.我们可以用来限制用户在给定时间内HTTP请求的数量.请求,可以是一个简单网站首页的GET请求,也可 ...

  2. windows中kill端口为8080的进程(或子进程)

    1.netstat -aon|findstr "8080" 查出8080端口被9436进程占用 2.查看PID对应的进程 tasklist|findstr "9436&q ...

  3. 美国gfs数据介绍和解析

    最近有个项目需要开发个气象信息API,可以通过经纬度查找未来几天的气象信息. 经过几天的研究,现在简单总结一下. 1.数据来源数据来源采自美国国家环境预报中心的GFS(全球预报系统),该系统每天发布4 ...

  4. Qt编写控件属性设计器12-用户属性

    一.前言 用户属性是后面新增加的一个功能,自定义控件如果采用的Q_PROPERTY修饰的属性,会自动识别到属性栏中,这个一般称为控件属性,在组态设计软件中,光有控件本身的控件属性还是不够的,毕竟这些属 ...

  5. 利用 Postman 中 Tests 断言校验返回结果

    前言 Postman目前是一款很火的接口测试工具,它有着非常强大结果判断能力.为什么说强大呢,因为Postman有自带的校验脚本,根本不需要我们去学习JS脚本语言,对于代码能力为0的各位测试小伙伴来说 ...

  6. Top 10 Machine Learning Algorithms For Beginners

    Linear Regression Logistic regression KNN Classification Support Vector Machine (SVM) Decision Trees ...

  7. didMoveToSuperview方法认识和使用

    由来: 今天给项目添加新功能——点击弹出阳历,阴历日期选择. 弹出日期选择是弹出的控制器,里面的日期选择控件是封装的View,View使用Xib画的, 遇到的问题是:控制器传数据给View,在awak ...

  8. C++ 宏和模板简介

    参考<21天学通C++>第14章节,对C++中的宏和模板进行了学习,总结起来其主要内容如下: (1) 预处理器简介 (2) 关键字#define与宏 (3) 模板简介 (4) 如何编写函数 ...

  9. Linux 缺少 mime.types 文件 mailcap

    问题描述: 一个项目当中使用的是 ossfs 挂载的一个 oss,在系统上传附件时,比如图片或视频时, 它的头信息为,application/octet-stream,上传后直接为二进制文件,访问的话 ...

  10. [转帖]nginx基础整理

    nginx基础整理 https://www.cnblogs.com/guigujun/p/6588545.html 目录结构如下: Nginx基础知识 Nginx HTTP服务器的特色及优点 Ngin ...