recorder.js

基于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: , //采样频率,默认为44100Hz(标准MP3采样率)
bitRate: , //比特率,默认为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 基于H5录音功能的更多相关文章

  1. 基于H5的摄像头视频数据流采集

    最近,为了支持部门团队的项目,通过H5实现摄像头的视频流数据的捕获,抓取到视频流后,传输到视频识别服务器进行后续的逻辑处理. 视频数据的采集过程,其实是比较没有谱的过程,因为之前没有研究过HTML5操 ...

  2. 基于H5的微信支付开发详解

    这次总结一下用户在微信内打开网页时,可以调用微信支付完成下单功能的模块开发,也就是在微信内的H5页面通过jsApi接口实现支付功能.当然了,微信官网上的微信支付开发文档也讲解的很详细,并且有实现代码可 ...

  3. ****基于H5的微信支付开发详解[转]

    这次总结一下用户在微信内打开网页时,可以调用微信支付完成下单功能的模块开发,也就是在微信内的H5页面通过jsApi接口实现支付功能.当然了,微信官网上的微信支付开发文档也讲解的很详细,并且有实现代码可 ...

  4. 基于h5的图片无刷新上传(uploadifive)

    基于h5的图片无刷新上传(uploadifive) uploadifive简介 了解uploadify之前,首先了解来一下什么是uploadify,uploadfy官网,uploadify和uploa ...

  5. ***PHP基于H5的微信支付开发详解(CI框架)

    这次总结一下用户在微信内打开网页时,可以调用微信支付完成下单功能的模块开发,也就是在微信内的H5页面通过jsApi接口实现支付功能.当然了,微信官网上的微信支付开发文档也讲解的很详细,并且有实现代码可 ...

  6. 前端视频直播技术总结及video.js在h5页面中的应用

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...

  7. 基于H5的移动端开发,window.location.href在IOS系统无法触发问题

    最近负责公司的微信公众号开发项目,基于H5进行开发,某些页面window.location.href在Android机上能正常运行而IOS系统上无法运行,导致无法重定向到指定页面,查了好久终于找到方法 ...

  8. Arctext.js - 基于 CSS3 & jQuery 的文本弯曲效果

    Arctext.js 是基于 Lettering.js 的文本旋转插件,根据设置的旋转半径准确计算每个字母的旋转弧度并均匀分布.虽然 CSS3 也能够实现字符旋转效果,但是要让安排每个字母都沿着弯曲路 ...

  9. Vue.js – 基于 MVVM 实现交互式的 Web 界面

    Vue.js 是用于构建交互式的 Web  界面的库.它提供了 MVVM 数据绑定和一个可组合的组件系统,具有简单.灵活的 API.从技术上讲, Vue.js 集中在 MVVM 模式上的视图模型层,并 ...

随机推荐

  1. [已解决]报错This event loop is already running

    安装nest_asyncio pip install nest_asyncio 导入并调用 import nest_asyncio nest_asyncio.apply()

  2. gulp+sass+react前端开发,环境搭建

    由于前端技术的发展与市场需求的提高,前端开发已经不仅仅是写几个页面那么简单.如何有效的开发.管理一个越来越庞大.越来越复杂的前端项目,成为互联网团队必须要面对的难题. 各种js库.ui库曾经火极一时. ...

  3. Ubuntu's Software

    (1)indicator-sysmonitor & acpi (2)nvidia-prime (3)sogou (4)wps (5)ubuntu-tweak

  4. ps使logo背景色透明

    方法一:魔法工具(对复杂的logo误差较大) 魔法工具--左键点击选区--delete--保存 方法二:拾色器 1.有的站上的素材图片不能直接用,需要先变成rgb图像,可这样操作:图像\模式,选择rg ...

  5. jQuery - 事件相关

    <script> $(function() { // 事件绑定 // 第一种方式 $("#btn").click(function() { alert("1 ...

  6. [原创] delphi Memo 滚动到底部/开始 [Delphi XE、Delphi 7]

    以前控制Memo滚动到底部的操作: SendMessage(memo1.Handle,WM_VSCROLL,SB_BOTTOM,0); 或者 Memo1.SelLength:=Length(Memo1 ...

  7. 线性dp——hdu6578经典dp

    多校第一场第一题,这种类型的dp之前做过两题,状态转移一般是从当前状态往后推的 很经典的dp,不过很卡时间 /* 定义 dp[t][i][j][k]代表填完前 t 个位置后,{0, 1, 2, 3} ...

  8. 58 matlab 编程

    0 引言 matlab中有些东西记录一下 1 matlab coder matlab命令行窗口输入: coder 回车即可打开matlab coder 窗口.接着,matlab将引导你把matlab格 ...

  9. NX二次开发-如何判断孔特征和边倒圆是否在凸台特征后面?

    在建模的时候,部件导航器里的特征按建模顺序是有特征时间戳记的. 我们可以根据特征时间戳记的名字来判断哪个特征在前,哪个在后. #include <uf.h> #include <uf ...

  10. mysql数据库中的索引介绍与优化(转)

    一.什么是索引? 索引用来快速地寻找那些具有特定值的记录,所有MySQL索引都以B-树的形式保存.如果没有索引,执行查询时MySQL必须从第一个记录开始扫描整个表的所有记录,直至找到符合要求的记录.表 ...