前段时间接了一个外包项目，有一个功能是网页在线录音并上传云服务器的需求，之前没有接触过，想着Google了一下找个demo改改； 找到三个，基本能满足需求：
https://github.com/uikoo9/recorder-online-upload https://github.com/michalstocki/FlashWavRecorder https://github.com/mattdiamond/Recorderjs第一个是在第二个的基础上扩展出来的，使用flash模块实现录音功能；第一个已经实现了录音并上传到服务器的功能，但是有个问题是录音中杂音太大，鉴于自身技术水平不支持优化源码，所以基本是被嫌弃了； 第三个是使用 HTML5 的 Audio API 实现的，如果不考虑 ie 的话，是非常推荐的；
以上是对三个录音插件的简单说明，我的需求是能够兼容低版本浏览器，实现录音后上传服务器并获取音频地址；
经过一番 Google，算是找到一个满足需求的：https://github.com/jwagener-soundcloud/recorder.js 这个插件基于 swfObject.js，低版本浏览器中使用 flash 实现录音功能，在高版本支持 HTML5 的浏览器中使用 Audio 实现；简直 perfect；同时它还封装好了上传功能，支持上传到服务器和 SoundCloud；
recorder.js 源码，集成了swfObject.js，封装了初始化、录音开始、录音停止、录音播放、录音上传等方法；插件有提供 demo，基本用法可以参考 demo 了解使用，就不多说了；
废话这么多，说一下我的需求：
网页在线录音，并上传到 upyun； 录音开始，同时执行倒计时（倒计时结束录音结束）； 录音结束，上传录音； 上传录音完成，执行方法进入下一个录音场景； 所有录音场景结束，展示录音列表并播放； 兼容低版本浏览器； // 初始化Recorder.initialize({ swfSrc: "../recorder.swf"});// 开始录音function record(callback){ Recorder.record({ start: function(){ callback && callback(); }, progress: function(milliseconds){ //document.getElementById("time").innerHTML = timecode(milliseconds); } });}// 上传模块var recordArr = []; // 因为最后需要展示音频列表，需要一个全局数组用于存储upyun返回的音频urlfunction upload(callback){ // 定义音频文件名 var fileName = $.cookie("TOEFL_TOKEN") ? "login" + new Date().getTime() : "nologin" + new Date().getTime(); // 获取upyun配置参数，参考upyun的form_api：http://docs.upyun.com/api/form_api/ // 这里先上传音频文件名至服务器端，服务端根据文件名生成对应的policy和signature返回客户端 $.ajax({ type: "GET", url: xm.baseURL + "/mkTpo/file/" + fileName + ".wav/posts.action", dataType : "json", success: function(data) { // 获取upyun_api参数 var expiration = data.expiration, // 时间戳 saveKey = data["save-key"], // 保存路径 bucket = data.bucket, // 空间名 policy = data.poily, // policy signature = data.signature; // signature // 插件封装方法，注：该方法中的注释可能导致程序报错，需删除 Recorder.upload({ method: "POST", url: "http://v0.api.upyun.com/universe1", // 录音上传url：upyun_api基本域名+空间名 audioParam: "file", // 上传upyun时，这个参数值固定为file，相当于表单提交中的<input type="file"> params: { // 这里填写获取的upyun_api参数，获取upyun的上传权限 "expiration": expiration, "save-key": saveKey, "bucket": bucket, "policy": policy, "signature": signature }, success: function(responseText){ // 上传成功之后upyun会返回音频文件的相关信息 var data = JSON.parse(responseText); recordArr.push(data.url); // 将录音音频的url追加到数组 callback && callback(); // 上传完成执行方法 } }); }, error: function(XMLHttpRequest, textStatus, errorThrown) { console.log("XMLHttpRequest.status: " + XMLHttpRequest.status); console.log("XMLHttpRequest.readyState: " + XMLHttpRequest.readyState); console.log("textStatus: " + textStatus); } });}