recorder.js 基于Html5录音功能的实现


Posted in HTML / CSS onMay 26, 2020

recorder.js

microphone基于HTML5的录音功能,输出格式为mp3文件。

前言

完全依赖H5原生API
所涉及的API:WebRTC、AudioContext、Worker、Video/Audio API、Blob、URL

兼容性

  • Chrome、FF、Edge、QQ、360(注:目前IE和Safari全版本不兼容)
  • 其中Chrome47以上以及QQ浏览器强制要求HTTPS的支持
  • 请尝试使用FF、Edge、360等浏览器进行体验,或将项目下载到本地通过localhost的方式 

使用方式

var recorder = new Recorder({
    sampleRate: 44100, //采样频率,默认为44100Hz(标准MP3采样率)
    bitRate: 128, //比特率,默认为128kbps(标准MP3质量)
    success: function(){ //成功回调函数
    },
    error: function(msg){ //失败回调函数
    },
    fix: function(msg){ //不支持H5录音回调函数
    }
});

API

//开始录音
recorder.start();
//停止录音
recorder.stop();
//获取MP3编码的Blob格式音频文件
recorder.getBlob(function(blob){ //获取成功回调函数,blob即为音频文件
//  ...
},function(msg){ //获取失败回调函数,msg为错误信息
//  ...
});

到此这篇关于recorder.js 基于Html5录音功能的实现的文章就介绍到这了,更多相关Html5录音功能内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS实现鼠标滑过鼠标点击代码写法
Dec 26 HTML / CSS
CSS3字体效果的设置方法小结
Jun 13 HTML / CSS
任意一块网页内容实现“活”的背景(目前火狐浏览器专有)
May 07 HTML / CSS
html5中localStorage本地存储的简单使用
Jun 16 HTML / CSS
Html5新增标签与样式及让元素水平垂直居中
Jul 11 HTML / CSS
html5 web本地存储将取代我们的cookie
Dec 26 HTML / CSS
html5使用canvas绘制文字特效
Dec 15 HTML / CSS
浅谈html5标签css3的常用样式
Oct 20 HTML / CSS
详解HTML5之pushstate、popstate操作history,无刷新改变当前url
Mar 15 HTML / CSS
HTML5在线预览PDF的示例代码
Sep 14 HTML / CSS
Ratchet 模态框的实现
Aug 19 HTML / CSS
完美实现CSS垂直居中的11种方法
Mar 27 HTML / CSS
HTML5+CSS设置浮动却没有动反而在中间且错行的问题
May 26 #HTML / CSS
H5 video poster属性设置视频封面的方法
May 25 #HTML / CSS
html5中嵌入视频自动播放的问题解决
May 25 #HTML / CSS
HTML5 FileReader对象的具体使用方法
May 22 #HTML / CSS
HTML5 Blob对象的具体使用
May 22 #HTML / CSS
详解如何获取localStorage最大存储大小的方法
May 21 #HTML / CSS
html5用video标签流式加载的实现
May 20 #HTML / CSS
You might like
PHP备份数据库生成SQL文件并下载的函数代码
2012/02/05 PHP
php全局变量和类配合使用深刻理解
2013/06/05 PHP
关于Jqzoom的使用心得 jquery放大镜效果插件
2010/04/12 Javascript
JavaScript随机排序(随即出牌)
2010/09/17 Javascript
按钮JS复制文本框和表格的代码
2011/04/01 Javascript
JavaScript中json对象和string对象之间相互转化
2012/12/26 Javascript
javascript中this做事件参数相关问题解答
2013/03/17 Javascript
JS判断客服QQ号在线还是离线状态的方法
2015/01/13 Javascript
使用jquery制作弹出框效果
2015/04/03 Javascript
深入探讨javascript函数式编程
2015/10/11 Javascript
微信小程序 教程之小程序配置
2016/10/17 Javascript
vue 监听某个div垂直滚动条下拉到底部的方法
2018/09/15 Javascript
微信小程序实现列表页的点赞和取消点赞功能
2018/11/02 Javascript
vue中axios请求的封装实例代码
2019/03/23 Javascript
JS实现的贪吃蛇游戏案例详解
2019/05/01 Javascript
koa中间件核心(koa-compose)源码解读分析
2020/06/15 Javascript
JavaScript Array.flat()函数用法解析
2020/09/02 Javascript
JavaScript实现HTML导航栏下拉菜单
2020/11/25 Javascript
[42:32]DOTA2上海特级锦标赛B组资格赛#2 Fnatic VS Spirit第二局
2016/02/27 DOTA
Python实现抓取网页并且解析的实例
2014/09/20 Python
使用Python的urllib和urllib2模块制作爬虫的实例教程
2016/01/20 Python
python在Windows下安装setuptools(easy_install工具)步骤详解
2016/07/01 Python
Python实现的微信公众号群发图片与文本消息功能实例详解
2017/06/30 Python
Python OpenCV 调用摄像头并截图保存功能的实现代码
2019/07/02 Python
对YOLOv3模型调用时候的python接口详解
2019/08/26 Python
python 解决mysql where in 对列表(list,,array)问题
2020/06/06 Python
函授本科毕业自我鉴定
2013/10/09 职场文书
工程监理应届生求职信
2013/11/09 职场文书
火锅店营销方案
2014/02/26 职场文书
《水乡歌》教学反思
2014/04/24 职场文书
媒体宣传策划方案
2014/05/25 职场文书
幼儿园门卫岗位职责范本
2014/07/02 职场文书
幼儿园小班见习报告
2014/10/31 职场文书
快消品行业营销模式与盈利模式分享
2019/09/27 职场文书
分析Python list操作为什么会错误
2021/11/17 Python
集英社今正式宣布 成立游戏公司“集英社Games”
2022/03/31 其他游戏