node+express搭建record.js录音实例

最新推荐文章于 2024-05-31 09:58:18 发布

nankiao

最新推荐文章于 2024-05-31 09:58:18 发布

阅读量3.5k

点赞数 3

分类专栏： node，express，record.js 文章标签： record.js 实时录音 node express

本文链接：https://blog.csdn.net/nankiao/article/details/78537581

版权

本文介绍如何利用Node.js和Express配合record.js搭建实时录音系统。通过创建record实例，监听录音和停止事件，将录音数据实时发送到后台。后台接收到数据后直接写入mp3文件，实现边录边播的功能。worker.js负责编码过程，与record.js通过消息传递协同工作。

摘要由CSDN通过智能技术生成

这个项目是拿来测试record.js实时录音并将录音数据发送给后台做处理，后台期望拿到实时的录音数据并能立马正常播放。

首先用node+express搭建开发环境，引入record.js相关文件，目录结构如下：

其中，JavaScript中的三个文件就是引入的record.js的所有文件。

npm start启动后，在浏览器访问localhost:3000。

首先new一个record的实例对象，给index.html页面对录音和停止按钮绑定点击事件，调用record对象的start()和stop()方法。

start.addEventListener('click',function(){
  this.disabled = true;
  stop.disabled = false;
  var audio = document.querySelectorAll('audio');
  for(var i = 0; i < audio.length; i++){
    if(!audio[i].paused){
      audio[i].pause();
    }
  }
  recorder.start();
});
stop.addEventListener('click',function(){
  this.disabled = true;
  start.disabled = false;
  recorder.stop();
  recorder.getBlob(function(blob){
    var audio = document.createElement('audio');
    audio.src = URL.createObjectURL(blob);
    audio.controls = true;
    container.