Html5网页纯JavaScript录制MP3音频
Html5网页纯JavaScript录制MP3音频
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Html5网页JavaScript录制MP3音频</title>
<meta charset="utf-8" />
</head>
<body>
Html5网页JavaScript录制MP3音频
录制
停止
上传
调试信息：
[removed][removed]
[removed]
var recorder = new MP3Recorder({
debug:true,
funOk: function () {
btnStart.disabled = false;
log('初始化成功');
},
funCancel: function (msg) {
log(msg);
recorder = null;
}
});
var mp3Blob;
function funStart(button) {
btnStart.disabled = true;
btnStop.disabled = false;
btnUpload.disabled = true;
log('录音开始...');
recorder.start();
}
function funStop(button) {
recorder.stop();
btnStart.disabled = false;
btnStop.disabled = true;
btnUpload.disabled = false;
log('录音结束，MP3导出中...');
recorder.getMp3Blob(function (blob) {
log('MP3导出成功');
mp3Blob = blob;
var url = URL.createObjectURL(mp3Blob);
var div = document.createElement('div');
var au = document.createElement('audio');
var hf = document.createElement('a');
au.controls = true;
au.src = url;
hf.href = url;
hf.download = new Date().toISOString() + '.mp3';
hf[removed] = hf.download;
div.appendChild(au);
div.appendChild(hf);
recordingslist.appendChild(div);
});
}
function log(str) {
recordingslist[removed] += str + '';
}
function funUpload() {
var fd = new FormData();
var mp3Name = encodeURIComponent('audio_recording_' + new Date().getTime() + '.mp3');
fd.append('mp3Name', mp3Name);
fd.append('file', mp3Blob);
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
recordingslist[removed] += '上传成功：' + mp3Name + '';
}
};
xhr.open('POST', 'upload.ashx');
xhr.send(fd);
}
[removed]
</body>
</html>
[javascript] view plain copy
在CODE上查看代码片派生到我的代码片
(function (exports) {
var MP3Recorder = function (config) {
var recorder = this;
config = config || {};
config.sampleRate = config.sampleRate || 44100;
config.bitRate = config.bitRate || 128;
navigator.getUserMedia = navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia;
if (navigator.getUserMedia) {
navigator.getUserMedia({
audio: true
},
function (stream) {
var context = new AudioContext(),
microphone = context.createMediaStreamSource(stream),
processor = context.createScriptProcessor(16384, 1, 1),//bufferSize大小，输入channel数，输出channel数
mp3ReceiveSuccess, currentErrorCallback;
config.sampleRate = context.sampleRate;
processor.onaudioprocess = function (event) {
//边录音边转换
var array = event.inputBuffer.getChannelData(0);
realTimeWorker.postMessage({ cmd: 'encode', buf: array });
};
var realTimeWorker = new Worker('js/worker-realtime.js');
realTimeWorker.onmessage = function (e) {
switch (e.data.cmd) {
case 'init':
log('初始化成功');
if (config.funOk) {
config.funOk();
}
break;
case 'end':
log('MP3大小：', e.data.buf.length);
if (mp3ReceiveSuccess) {
mp3ReceiveSuccess(new Blob(e.data.buf, { type: 'audio/mp3' }));
}
break;
case 'error':
log('错误信息：' + e.data.error);
if (currentErrorCallback) {
currentErrorCallback(e.data.error);
}
break;
default:
log('未知信息：', e.data);
}
};
recorder.getMp3Blob = function (onSuccess, onError) {
currentErrorCallback = onError;
mp3ReceiveSuccess = onSuccess;
realTimeWorker.postMessage({ cmd: 'finish' });
};
recorder.start = function () {
if (processor && microphone) {
microphone.connect(processor);
processor.connect(context.destination);
log('开始录音');
}
}
recorder.stop = function () {
if (processor && microphone) {
microphone.disconnect();
processor.disconnect();
log('录音结束');
}
}
realTimeWorker.postMessage({
cmd: 'init',
config: {
sampleRate: config.sampleRate,
bitRate: config.bitRate
}
});
},
function (error) {
var msg;
switch (error.code || error.name) {
case 'PERMISSION_DENIED':
case 'PermissionDeniedError':
msg = '用户拒绝访问麦客风';
break;
case 'NOT_SUPPORTED_ERROR':
case 'NotSupportedError':
msg = '浏览器不支持麦客风';
break;
case 'MANDATORY_UNSATISFIED_ERROR':
case 'MandatoryUnsatisfiedError':
msg = '找不到麦客风设备';
break;
default:
msg = '无法打开麦克风，异常信息:' + (error.code || error.name);
break;
}
if (config.funCancel) {
config.funCancel(msg);
}
});
} else {
if (config.funCancel) {
config.funCancel('当前浏览器不支持录音功能');
}
}
function log(str) {
if (config.debug) {
console.log(str);
}
}
}
exports.MP3Recorder = MP3Recorder;
})(window);
文件下载
评论信息
-
-
-
smartkit :不能正常上传阿2019-05-28 -
其他资源
- QT实战项目五--计算器
- C# 用户登录界面（用户信息保存在XML文档）
- PLECS code电流单闭环控制实现模型仿真
- 乐曲演奏硬件电路（轻轻听）.rar
- graceUIForUniApp.zip
- Microsoft Visual C++ 2019 Redistributable windows X64位机
- PHP+MYSQL在线考试系统，功能强大，高价买的，现共享，亲测能用。具体看描述
- python3.6.5安装包
- px4 姿态控制流程相关代码分析
- java图书馆管理系统项目总结PPT
- MES项目源码
- HS8145V HG8546M补齐Shell权限包.rar
- dotNetify-react-template：使用dotNetify的实时React SPA模板-源码
- SSM学生在线考试系统
- Linux和windows的DB2数据库下载.txt
- 云安全控制矩阵CCM.pdf
- 一个C语言编译器源码
- The Boost C++ Libraries.pdf
- 给Qt程序加图标Demo
- echarts安徽地图 anhui.json
- 使用HackRF在windows和linux下扫描GSM频道的程序,识别GMSK信号
- Labview2017 ASPT
- STM32 多串口DMA传输透传带DEBUG输出代码
- 电子购物商城系统（源代码+库文件） c#实现
- IE修复到默认状态的批处理
- IOComp Components Full Product 4.0.4 SP2
免责申明
【只为小站】的资源来自网友分享，仅供学习研究，请务必在下载后24小时内给予删除，不得用于其他任何用途，否则后果自负。基于互联网的特殊性，【只为小站】 无法对用户传输的作品、信息、内容的权属或合法性、合规性、真实性、科学性、完整权、有效性等进行实质审查；无论 【只为小站】 经营者是否已进行审查，用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。
本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二条之规定，若资源存在侵权或相关问题请联系本站客服人员，zhiweidada#qq.com，请把#换成@，本站将给予最大的支持与配合，做到及时反馈和处理。关于更多版权及免责申明参见 版权及免责申明
本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二条之规定，若资源存在侵权或相关问题请联系本站客服人员，zhiweidada#qq.com，请把#换成@，本站将给予最大的支持与配合，做到及时反馈和处理。关于更多版权及免责申明参见 版权及免责申明