如何使用 javascript 从 Audio Element 录制音频

2024-05-02

我正在使用 HTML5 和 Javascript 制作录音机,并且不想包含任何第三方 API,我的第一步是使用以下命令创建音频检索器和播放器<audio>标签和navigator.webkitGetUserMedia从我的麦克风获取音频并通过播放的功能<audio>元素,但此时我无法获取数组中的音频数据,我不知道该使用哪个函数来做什么。


简单,只需创建一个音频节点,下面是来自 MattDiamond 的 RecorderJS 的调整代码:

function RecordAudio(stream, cfg){

    var config = cfg || {};
    var bufferLen = config.bufferLen || 4096;
    var numChannels = config.numChannels || 2;
    this.context = stream.context;
    var recordBuffers = [];    
    var recording = false;
    this.node = (this.context.createScriptProcessor ||
                 this.context.createJavaScriptNode).call(this.context,
                 bufferLen, numChannels, numChannels);


    stream.connect(this.node);
    this.node.connect(this.context.destination);    

    this.node.onaudioprocess = function(e){
      if (!recording) return;
      for (var i = 0; i < numChannels; i++){
          if(!recordBuffers[i])  recordBuffers[i] = [];
          recordBuffers[i].push.apply(recordBuffers[i], e.inputBuffer.getChannelData(i));
      }
    }

    this.getData = function(){
        var tmp = recordBuffers;
        recordBuffers = [];
        return tmp;     // returns an array of array containing data from various channels
    };

    this.start() = function(){
        recording = true;
    };

    this.stop() = function(){
        recording = false;
    };

}

用法示例:

var recorder = new RecordAudio(userMedia);
recorder.start();
recorder.stop();
var recordedData = recorder.getData();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 javascript 从 Audio Element 录制音频 的相关文章

  • 通知用户消息仍在输入中

    我正在使用 Laravel 5 6 7 Socket IO 和 vue js 我没有使用 Pusher 和 redis 下面是我的代码 用于向与我一对一聊天的用户发送消息 var url http localhost 6001 apps M
  • 如何获取 RxJSSubject 或 Observable 的当前值?

    我有 Angular 2 服务 import Storage from storage import Injectable from angular2 core import Subject from rxjs Subject Inject
  • HTML 覆盖高度覆盖整个可见页面

    我有一个使用 AJAX 加载一些内容的网页 我想在加载过程中显示带有加载指示器的覆盖层 以便用户无法与页面的大部分内容交互 除了顶部的菜单 我正在使用 jQuery 和jQuery BlockUI 插件 http malsup com jq
  • 如何从表中选择所有偶数 id?

    我想从 MySQL 数据库的表中选择所有甚至帖子 ID 然后显示它们 我还想获取所有带有奇怪 id 的帖子并将它们显示在其他地方 我想使用 PHP 来完成此操作 因为这是我使用的服务器端语言 或者 我是否必须选择所有帖子 然后使用 Java
  • 零作为 IIFE 中的第一个参数[重复]

    这个问题在这里已经有答案了 In babeljs v6 5 1 class Foo 编译为 use strict var classCallCheck2 require babel runtime helpers classCallChec
  • 在 asp.net vb 中通过第一个下拉列表值填充第二个下拉列表

    我在使用 asp net vb 时遇到了一些问题 我想做的是有2个下拉框 第一个下拉菜单将有 1 2 3 例如 第二个下拉菜单将有 A 乙 C 默认情况下 但是 如果选择 1 我希望第二个下拉菜单自动选择 c 我不知道 JavaScript
  • jQuery 的 css() 在应用于滚动事件时滞后

    我正在尝试实现一个简单的 固定标题 表 我知道这在理论上只能用 CSS 来完成 但是当涉及到 OSX Lion 及其消失的滚动条时 它效果不佳 所以我用 jQuery 来做 方法很简单 只有1 5行代码 inbox scroll funct
  • Chrome SuppressDifferentOriginSubframeJSDialogs 使用 JS 设置覆盖?

    Chrome 开发团队显然刚刚推出了一项名为 SuppressDifferentOriginSubframeJSDialogs 的新 功能 这使得默认情况下不会显示来自与父级不同域上的 iFrame 的警报 确认框 https www ch
  • 在 Angular2 项目中集成 Treant-js

    我正在尝试在 Angular2 项目中使用 treant js 但我正在努力解决如何正确集成它的问题 我有一个工作正常的 JavaScript HTML 示例 我正在尝试在 Angular2 中工作 我创建了一个组件 从 npm 添加了 t
  • JQuery DataTable 单元格从行单击

    我正在尝试在 jquery 数据表上实现一个函数 该函数返回单击行的第一列和第四列 我正在遵循这个示例 它允许我操作单击的行http datatables net examples api select single row html ht
  • ReactJS:从没有 onChange 事件的 props 中选择默认值?

    所以 我只是想知道我是否绝对需要在 React 中的选择组件上有一个 onChange 事件处理程序 我有一个道具传递我想要选择的选项的默认值 如果我有的话 它就没有问题
  • Chrome Javascript 调试器暂停时不会重新加载页面

    有时 当我在 Chrome 中调试某些 javascript 并且暂停了 javascript 时 如果我尝试重新加载页面 chrome 只会 继续 调试器 单步执行到下一个断点 似乎没有任何方法可以强制 javascript 完全停止运行
  • 将 NPM 包客户端与 nuxt 结合使用

    我对 nuxt 和 javascript 非常陌生 我正在尝试弄清楚如何在客户端使用我的应用程序的依赖项 我将它们列在我的 nuxt config js 中并使用 npm 安装 我也有一个文件 plugins导入它们的目录 不确定这是否好
  • Javascript 选择 onchange='this.form.submit()'

    我有一个带有选择和一些文本输入的表单 我希望在更改选择时提交表单 使用以下方法可以正常工作 onchange this form submit 但是 如果表单还包含提交按钮 则当选择更改时 表单不会提交 我猜有某种冲突 我在这里有什么选择
  • 理论上防止 WebSocket 中第一个收到的消息丢失

    服务器端代码发送消息立即地连接打开后 它向客户端发送初始配置 问候语 以下代码是在客户端 var sock new WebSocket url sock addEventListener error processError sock ad
  • RTCDataChannel发送方法不发送数据

    我的 RTCDataChannel 遇到一个奇怪的问题 我正在对 WebRTC 进行一些研究 并且已经可以进行 WebRTC 音频 视频聊天 现在我想使用 RTCDataChannel 添加文本聊天和文件共享 我已经像这样创建了 RTCDa
  • 使用Promise而不拒绝它会导致内存泄漏吗? [复制]

    这个问题在这里已经有答案了 代码如下 function test value return new Promise function fulfill reject try fulfill true catch e throw e 我担心的是
  • 如何在粘贴时获取文本区域输入字段的新值?

    我发现当我尝试从文本区域字段读取值时onpaste调用函数时 我得到字段的旧值 粘贴操作之前的值 而不是新值 粘贴操作之后的值 以下是此行为的演示 http jsfiddle net qsDnr http jsfiddle net qsDn
  • 在 Google Apps 脚本中的文本前插入换行符

    我需要在 Google 文档中的某些文本之前插入一些换行符 尝试过这种方法但出现错误 var body DocumentApp getActiveDocument getBody var pattern WORD 1 var found b
  • 使用 jquery 提供附加功能时菜单未正确对齐

    I need to make a mega menu similar to one as show in image below 到目前为止 我已经能够在某种程度上使其发挥作用 例如jsFiddle 在这里 http jsfiddle ne

随机推荐

  • HttpURLConnection 发送图像、音频和视频文件,参数可以是(String 或 Json String)Android

    我正在分享solution发送一个image audio or a video带有参数的文件使用HttpURL连接 参数可以是 纯字符串或 JSON Android 客户端到 PHP 后端 设想 必须上传媒体文件 带参数的音频 视频和图像
  • 使用 keras.utils.Sequence 多处理和数据库 - 何时连接?

    我正在使用 Keras 和 Tensorflow 后端训练神经网络 数据集不适合 RAM 因此 我将其存储在 Mongo 数据库中并使用子类检索批次keras utils Sequence 一切正常 如果我跑的话model fit gene
  • 安卓卸载通知

    当用户卸载应用程序时有什么方法可以发送通知 如果用户卸载该应用程序 应用程序所有者应该收到以下用户已卸载该应用程序的通知 是否可以 应用程序本身不可能 除非有来自同一作者的其他应用程序可以检查 但我认为有一个可用但复杂的解决方法 应用程序可
  • 如何在 Microsoft bot 框架中仅使用图像的 base64 编码字符串显示图像?

    我尝试了下面的代码 这是我在模拟器中得到的输出 message Attachments Add new Attachment ContentUrl data image jpeg base64 xxxx 数据 uri 图像似乎有最大大小 但
  • Postgresql - 确定从级联删除中删除哪些记录

    我继承了一个相当大的 postgresql 数据库 我们有一个每月运行的作业 用于备份现有数据库并使用我们收到的更新的供应商数据创建一个新数据库 目前有一个小问题 在不深入了解表设置 数据建模内容等细节的情况下 我相信它可以通过简单的删除查
  • 将 char 数组转换为 hex 数组 (C++)

    我的问题是将字符数组转换为十六进制数字数组 我需要从字符数组中取出 2 个字符并将它们转换为一个十六进制数字 这是我的输入 unsigned char text 1024 06fb7405eba8d9e94fb1f28f0dd21fdec5
  • Rails 6 + Capistrano - 没有这样的 puma.sock 文件

    拜托 我有一个大问题10多个小时了 每当我使用 Capistrano 和 Puma 在 Rails 中运行应用程序部署并重新启动 nginx 时 当我尝试访问我的 Web 时 我会看到此错误 在此输入图像描述 https i stack i
  • php artisan migrate 命令错误:找不到驱动程序

    我的操作系统是windows Illuminate Database QueryException 找不到驱动程序 SQL 从 information schema tables 中选择 其中 table schema blog 且 tab
  • .net Framework 4 中的 nameof 表达式

    Visual Studio 2015 和 c 6 中引入了 nameof 表达式 nameof C 和 Visual Basic 参考 https msdn microsoft com en us library dn986596 28v
  • 浮点转换和性能

    我知道在浮点数和整数之间进行转换时可能会出现错误 但是性能如何 请忽略准确性问题 一般来说 如果我对不同算术类型的操作数 即不同的浮点类型 例如 float and double 和浮点 整数类型组合 例如float and int 是否存
  • 如何在 REST(Jersey) 中创建过滤器或处理程序来包装 JAX-RS 请求?

    我的 jax rs 应用程序中有一些资源 我想在 jax rs 请求进入由 javax ws rs Path 注释的资源之前验证它 那么 我如何为我的资源创建处理程序或过滤器 我搜索了很多网站 他们的建议是使用代理或 servlet 过滤器
  • Aurelia 验证:对同一属性应用一些关于更改的规则和一些关于模糊的规则

    我有一个值的输入字段 该值应该正好有 5 位数字 我想在立即输入数字以外的字符 onChange 时显示错误 但仅在模糊时显示字符串长度不足的错误 我的规则目前看起来是这样的 ValidationRules ensure myInput m
  • 根据要求在 Python/Matplotlib 中为热图着色

    我正在尝试制作具有指定颜色要求的热图 我想为数据设置一个间隔并判断为ok并将其着色为绿色 其余结果应着色为红色 有谁知道如何做到这一点吗 我附上了一个使用 pandas 和 matplotlib 的简单示例 以便更好地理解 import n
  • java.io.IOException:无效的密钥库格式

    有谁知道如何解决这个问题 我尝试了很多方法 但没有一个有效 当我单击更多详细信息时 我得到以下信息 at sun security provider JavaKeyStore engineLoad Unknown Source atsun
  • 数字字符串到整数列表?

    例如 我面临的任务是转换一串混合数字 1 3 5 8 10 我的目标是将这些数字作为整数放入列表中 我有知识和诀窍来分割字符串和 int 它们以将它们转换为整数 但问题来了how我正在做 我遇到的具体问题是循环遍历字符串 查找字符并将它们转
  • 空合并运算符覆盖

    我知道这样做是没有意义的 xstring ToLower xx 因为我打电话ToLower 在检查 null 之前被调用 有没有办法解决这个问题 保持语法整洁 我可以覆盖 字符串的运算符 以便它只调用ToLower when xstring
  • Android开放电话应用

    我只想打开 Android 设备的电话应用程序 我不想向该应用程序提供电话号码 只是想打开它 我正在使用手机应用程序的包名称来打开它 因为我可以使用下面的代码通过该包名称打开任何我想要的应用程序 Intent launchIntent ge
  • 在 Photoshop 脚本中打开和关闭多个图层

    我在 Photoshop 中有 6 个组 每个组内包含多个图层 我希望打开 关闭每个组中的图层以创建图像的每种可能的组合 有人能指出我正确的方向吗 我从来没有在 Photoshop 中编写过脚本 而是尝试自己解决这个问题 我自己对 CS5
  • Pulumi Azure Pipeline 任务

    我是 Pulumi 的新手 所以目前我正在努力尝试在我的 Azure 发布管道中运行它以创建我的基础设施 在开发过程中 我使用本地存储来存储我的 pulumi 状态 pulumi login local 我已经创建了我的堆栈 dev 是其中
  • 如何使用 javascript 从 Audio Element 录制音频

    我正在使用 HTML5 和 Javascript 制作录音机 并且不想包含任何第三方 API 我的第一步是使用以下命令创建音频检索器和播放器