插件描述：html5 js 录音 mp3 wav ogg webm amr 格式，支持pc和Android、ios部分浏览器、和Hybrid App(提供Android IOS App源码)，微信也是支持的，提供H5版语音通话聊天示例
Recorder用于html5录音
支持大部分已实现getUserMedia的移动端、PC端浏览器；主要包括：Chrome、Firefox、Safari、Android WebView、腾讯Android X5内核(QQ、微信)；不支持：UC系内核(典型的支付宝，大部分国产手机厂商的浏览器)，IOS上除Safari外的其他任何形式的浏览器(含PWA、WebClip、任何App内网页)。
录音默认输出mp3格式，另外可选wav格式(raw pcm format此格式录音文件超大)；有限支持ogg(beta)、webm(beta)、amr(beta)格式；支持任意格式扩展(前提有相应编码器)。
mp3默认16kbps的比特率，2kb每秒的录音大小，音质还可以(如果使用8kbps可达到1kb每秒，不过音质太渣)。主要用于语音录制，双声道语音没有意义，特意仅对单声道进行支持。mp3和wav格式支持边录边转码，录音结束时转码速度极快，支持实时转码成小片段文件和实时传输，demo中已实现一个语音通话聊天，下面有介绍；其他格式录音结束时可能需要花费比较长的时间进行转码。
mp3使用lamejs编码，压缩后的recorder.mp3.min.js文件150kb左右(开启gzip后54kb)。如果对录音文件大小没有特别要求，可以仅仅使用录音核心+wav(raw pcm format)编码器，压缩后的recorder.wav.min.js不足5kb。
快速使用
【1】加载框架
在需要录音功能的页面引入压缩好的recorder.xxx.min.js文件即可 (注意：需要在https等安全环境下才能进行录音)
或者直接使用源码(src内的为源码、dist内的为压缩后的)，可以引用src目录中的recorder-core.js+相应类型的实现文件，比如要mp3录音：
可自行用 AMD/CommonJS 写法把 Recorder 函数(把格式支持文件合并过来)进行导出；或者尝试直接 import/require recorder.mp3.min.js，应该可以通过全局window.Recorder访问，简单粗暴。vue?! angular?!可用??!!，webpack使用。
【2】调用录音
然后使用，假设立即运行，只录3秒varrec=Recorder({type:"mp3",sampleRate:16000,bitRate:16});//mp3格式，指定采样率hz、比特率kbps，其他参数使用默认配置；注意：是数字的参数必须提供数字，不要用字符串；需要使用的type类型，需提前把格式支持文件加载进来，比如使用wav格式需要提前加载wav.js编码引擎
//vardialog=createDelayDialog();开启可选的弹框伪代码，需先于open执行，因为回调不确定是同步还是异步的
rec.open(function(){//打开麦克风授权获得相关资源
//dialog&&dialog.Cancel();如果开启了弹框，此处需要取消
rec.start();//开始录音
setTimeout(function(){
rec.stop(function(blob,duration){//到达指定条件停止录音
console.log((window.URL||webkitURL).createObjectURL(blob),"时长:"+duration+"ms");
rec.close();//释放录音资源
//已经拿到blob文件对象想干嘛就干嘛：立即播放、上传
/*立即播放例子*/
varaudio=document.createElement("audio");
audio.controls=true;
document.body.appendChild(audio);
//简单的一哔，注意不用了时需要revokeObjectURL，否则霸占内存
audio.src=(window.URL||webkitURL).createObjectURL(blob);
audio.play();
},function(msg){
console.log("录音失败:"+msg);
});
},3000);
},function(msg,isUserNotAllow){//用户拒绝未授权或不支持
//dialog&&dialog.Cancel();如果开启了弹框，此处需要取消
console.log((isUserNotAllow?"UserNotAllow，":"")+"无法录音:"+msg);
});
//我们可以选择性的弹一个对话框：为了防止移动端浏览器存在第三种情况：用户忽略，并且(或者国产系统UC系)浏览器没有任何回调
/*伪代码：
functioncreateDelayDialog(){
if(IsMobile){//只针对移动端
returnnewAlertDialogComponent
.Message("录音功能需要麦克风权限，请允许；如果未看到任何请求，请点击忽略~")
.Button("忽略")
.OnClick(function(){//明确是用户点击的按钮，此时代表浏览器没有发起任何权限请求
//此处执行fail逻辑
console.log("无法录音：权限请求被忽略");
})
.OnCancel(NOOP)//自动取消的对话框不需要任何处理
.Delay(8000);//延迟8秒显示，这么久还没有操作基本可以判定浏览器有毛病
};
};
*/
【附】录音上传示例varTestApi="/test_request";//用来在控制台network中能看到请求数据，测试的请求结果无关紧要
varrec=Recorder();rec.open(function(){rec.start();setTimeout(function(){rec.stop(function(blob,duration){
//-----↓↓↓以下才是主要代码↓↓↓-------
//本例子假设使用jQuery封装的请求方式，实际使用中自行调整为自己的请求方式
//录音结束时拿到了blob文件对象，可以用FileReader读取出内容，或者用FormData上传
varapi=TestApi;
/***方式一：将blob文件转成base64纯文本编码，使用普通application/x-www-form-urlencoded表单上传***/
varreader=newFileReader();
reader.onloadend=function(){
$.ajax({
url:api//上传接口地址
,type:"POST"
,data:{
mime:blob.type//告诉后端，这个录音是什么格式的，可能前后端都固定的mp3可以不用写
,upfile_b64:(/.+;\s*base64\s*,\s*(.+)$/i.exec(reader.result)||[])[1]//录音文件内容，后端进行base64解码成二进制
//...其他表单参数
}
,success:function(v){
console.log("上传成功",v);
}
,error:function(s){
console.error("上传失败",s);
}
});
};
reader.readAsDataURL(blob);
/***方式二：使用FormData用multipart/form-data表单上传文件***/
varform=newFormData();
form.append("upfile",blob,"recorder.mp3");//和普通form表单并无二致，后端接收到upfile参数的文件，文件名为recorder.mp3
//...其他表单参数
$.ajax({
url:api//上传接口地址
,type:"POST"
,contentType:false//让xhr自动处理Content-Typeheader，multipart/form-data需要生成随机的boundary
,processData:false//不要处理data，让xhr自动处理
,data:form
,success:function(v){
console.log("上传成功",v);
}
,error:function(s){
console.error("上传失败",s);
}
});
//-----↑↑↑以上才是主要代码↑↑↑-------
},function(msg){console.log("录音失败:"+msg);});},3000);},function(msg){console.log("无法录音:"+msg);});
【附】问题排查打开Demo页面试试看，是不是也有同样的问题。
检查是不是在https之类的安全环境下调用的。
检查是不是IOS系统，确认caniuseIOS对getUserMedia的支持情况。
检查上面第1步是否把框架加载到位，在Demo页面有应该加载哪些js的提示。
知识库
本库期待的使用场景是语音录制，因此音质只要不比高品质的感觉差太多就行；1分钟的语音进行编码是很快的，但如果录制超长的录音，比如10分钟以上，不同类型的编码可能会花费比较长的时间，因为只有边录边转码(Worker)支持的类型才能进行极速转码。另外未找到双声道语音录制存在的意义(翻倍录音数据大小，并且拉低音质)，因此特意仅对单声道进行支持。
浏览器Audio Media兼容性mp3最好，wav还行，其他要么不支持播放，要么不支持编码。
特别注：IOS(11.X、12.X)上只有Safari支持getUserMedia，IOS上其他浏览器均不支持，参考下面的已知问题。
特别注：大部分国产手机厂商的浏览器(系统浏览器，都用的UC内核？)虽然支持getUserMedia方法，但并不能使用，表现为直接返回拒绝或者干脆没有任何回调；UC系列目测全部阵亡(含支付宝)。
特别注：如果在iframe里面调用的录音功能，并且和上层的网页是不同的域(跨域了)，如果未设置相应策略，权限永远是被拒绝的，参考此处。另外如果要在非跨域的iframe里面使用，最佳实践应该是让window.top去加载Recorder(异步加载js)，iframe里面使用top.Recorder，免得各种莫名其妙(比如微信里面的各种渣渣功能，搞多了就习惯了)。
如果需要最大限度的兼容IOS(仅增加微信支持)，可以使用RecordApp，它已包含Recorder，源码在src/app-support、app-support-sample中，但此兼容库需要服务器端提供微信JsSDK的签名、下载素材接口，涉及微信公众(订阅)号的开发。支持Recorder
PC浏览器√√
Android Chrome Firefox√√
Android微信(含小程序)√√
Android Hybrid App√√
Android其他浏览器未知未知
IOS Safari√√
IOS微信(含小程序)√
IOS Hybrid App√
IOS其他浏览器
开发难度简单复杂
第三方依赖无依赖微信公众号
