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. 冲上云霄,Dubbo Go!

    来源:开源中国社区 5 月 21 日,经过一年多的孵化,Apache Dubbo 从 Apache 软件基金会毕业,成为 Apache 顶级项目.推荐:厉害了,Dubbo 正式毕业! Dubbo 是阿 ...

  2. 1-Navicat无法远程连接Ubuntu上的MySQL(已解决)

    转发自: https://jingyan.baidu.com/article/4d58d54156ff069dd4e9c085.html

  3. android webview 输入法键盘遮挡输入框的问题

    新建一个工具类: /** * 解决webView键盘遮挡问题的类 * Created by zqy on 2016/11/14. */ public class KeyBoardListener { ...

  4. 关于hadoop多次format之后,会出现的dataNode消失问题

    如标题,最近我由于想初始化以下hadoop集群,之后却发现启动集群后所有的DataNode都消失了. 问题查找: 由于时所有的DataNode都出了问题,于是我翻找了以下DataNode的日志(默认在 ...

  5. 文件上传到ftp服务工具类

    直接引用此java工具类就好 import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundExcep ...

  6. C#常用设计模式

    1.单例模式 单例模式恐怕是很多开发人员最先接触到的模式之一,可以认为就是一个全局变量.它的初始化过程无非就是一开始就new 一个instance,或者惰性初始化等需要用到的时候new 一个insta ...

  7. context:component-scan报错

    文件头补上 xmlns:context=”http://www.springframework.org/schema/context” xsi:schemaLocation=”http://www.s ...

  8. Magento获取当前页面URL地址

    Magento获取当前页面URL地址 http://www.sunhaibing.com/?p=1260 在Magento中,可以通过core/url助手类中的getCurrentUrl()方法获取当 ...

  9. php数组函数,遍历数组的几种方法

    数组创建: 1.array(): 生成一个数组 $a=array("Dog","Cat","Horse"); print_r($a);数组值 ...

  10. ThinkPHP v5 新漏洞攻击案例首曝光,阿里云已可告警并拦截

    2018年12月10日,ThinkPHP v5系列发布安全更新,修复了一处可导致远程代码执行的严重漏洞.阿里云态势感知已捕获多起基于该漏洞的真实攻击,并对该漏洞原理以及漏洞利用方式进行分析.现在,对于 ...