问题标签 [scriptprocessor]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
187 浏览

javascript - 使用多个 ScriptProcessor 和 Analyzer 节点时 Chrome 崩溃

我正在构建一个网络应用程序,允许用户发展网络音频合成器(https://gensynth.ou.edu/#/evolve)。但是,在 chrome 上,每当您在进化过程中单击刷新几次并mutation amount一直向上播放并玩耍时,应用程序都会意外崩溃(该选项卡仅显示“aw snap”崩溃屏幕)。

当合成器加载时,它通过连接到静音增益节点的 scriptProcessor 和分析器节点进行播放,因此它可以渲染出初始频谱图(最初尝试为此使用离线上下文,但这只是非常糟糕)。然后,当用户点击演奏乐器时,它会通过一组不同的脚本/分析器节点进行演奏。每次后续播放,振荡器和过滤器都会重新生成并连接到同一组脚本/分析器节点。

似乎每当较旧的脚本节点尝试收集垃圾时它就会崩溃,因为当我尝试保持对节点的引用并且没有将其onaudioprocess函数设置为 null 时它发生的频率较低(这确实会严重影响内存)。有没有更好或更标准的方法来做到这一点?

我并不完全是在这篇文章中放入什么代码,因为这个问题只有在大部分时间都放在一起时才会出现。使用脚本/分析器节点的主要小部件在这里

在 Firefox 中运行良好,如果有任何其他信息对我提供帮助,请告诉我。

编辑:仅隔离此页面new x30上的可视化程序代码,您可以通过单击几次按钮来获得崩溃(尽管频率较低) 。

0 投票
1 回答
212 浏览

javascript - scriptProcessorNode 振荡器频率

我正在研究一个网络音频随机振荡器,并且在使用 scriptProcessorNode 时遇到了问题。我的算法使用随机游走来确定波形中的动态断点,然后在它们之间进行插值。

随着断点在 x 轴上移动,我认为振荡波形的频率会发生变化,但只是有一个过滤效果,而且频率似乎只是由 scriptProcessorNode 缓冲区大小决定的,它必须是 256 之间的 2 的幂和 16384。

如何更改 scriptProcessorNode 振荡器的频率?

这是我的综合代码:

这是一个工作示例的链接:http: //andrewbernste.in/bernie/gendy011.html

这一切都基于 Iannis Xenakis 的 GENDY 随机综合程序。

谢谢!

0 投票
2 回答
481 浏览

javascript - scriptProcessorNode.onaudioprocess 无法访问全局变量

我正在围绕 scriptProcessorNode 振荡器构建课程。我已经将我的onaudioprocess事件处理程序包装在一个函数中Gendy.prototype.process。我可以从这个包装函数中访问全局变量和函数,但不能从onaudioprocess函数中访问它们。

我为这些属性设计了一个解决方法,在包装函数中重新定义它们,但是当尝试使用this.walk().

这是我的代码:

这听起来不错,但会返回错误:

几行,然后

永远。

这是 scriptProcessorNode 的错误吗?任何见解将不胜感激!

0 投票
1 回答
253 浏览

web-audio-api - ScriptProcessorNode - 防止抖动?

我正在使用 aScriptProcessorNode为了从MediaStream/录制音频MediaStreamNode。每当 UI 操作稍微阻塞主线程(如在画布上绘图)时,音频结果在那些特定时刻就会变得紧张。

似乎AudioWorker最终会被实施,我认为这会解决我的问题,但截至目前,解决方案是什么?

干杯!

0 投票
1 回答
2106 浏览

javascript - 将基于脚本处理器的应用程序移植到 audioworklet

由于旧的 Webaudio 脚本处理器自 2014 年以来已被弃用,并且 Audioworklets 在 Chrome 64 中出现,我决定尝试一下。但是我在移植我的应用程序时遇到了困难。我将从一篇不错的文章中举两个例子来说明我的观点。

首先是脚本处理器方式:

另一个填充缓冲区然后播放它:

两者之间的最大区别是第一个在播放期间用新数据填充缓冲区,而第二个预先生成所有数据。

由于我生成了大量数据,因此我无法事先进行。Audioworklet有很多示例,但它们都使用其他节点,只需在这些节点上运行 .start(),连接它,它就会开始生成音频。当我没有这样的方法时,我无法找到一种方法来做到这一点。

所以我的问题基本上是如何在 Audioworklet 中执行上述示例,当数据在某个数组的主线程中连续生成并且该数据的播放发生在 Webaudio 线程中时。

我一直在阅读有关消息端口的内容,但我也不确定这是否可行。这些例子并没有将我指向我所说的那个方向。我可能需要的是用我自己的数据在 AudioWorkletProcesser 派生类中提供流程函数的正确方法。

我目前基于脚本处理器的代码位于github,特别是 vgmplay-js-glue.js。

我一直在向 VGMPlay_WebAudio 类的构造函数添加一些代码,从示例转到实际结果,但正如我所说,我现在不知道该朝哪个方向移动。

0 投票
1 回答
1632 浏览

reactjs - 错误:AudioWorkletNode 在 React App 中未定义

我正在尝试在 React 中创建一个 AudioWorklet。我正在使用 create-react-app 并将在 React 上下文之外工作的脚本导入 App.jsx。它无法实例化我的 AudioWorkletNode 扩展并引发以下错误:

编码:

完全相同的代码成功地初始化了 AudioWorklet,所以我有点困惑为什么 AudioWorkletNode 没有被识别。

0 投票
5 回答
8562 浏览

reactjs - AudioWorklet 错误:DOMException:用户中止了请求

我已经成功地在 React 中实例化了一个简单的 AudioWorklet,并希望像 Google 的示例一样启动一个简单的振荡器。为了测试运行它,我正在渲染一个按钮,其 onClick 事件调用以下内容:

src/App.jsx:

问题是,每次点击时,addModule 方法都会返回以下错误:

我在 Ubuntu v16.0.4 上运行 Chrome v66。

src/worklet/worklet-node.js:

src/worklet/processor.js

0 投票
0 回答
720 浏览

javascript - 使用 AudioWorklet 流式传输捕获的音频时,如何防止中断/断断续续/故障?

我们一直在开发一个基于 JavaScript 的音频聊天客户端,它在浏览器中运行并通过 WebSocket 将音频样本发送到服务器。我们之前尝试使用 Web Audio API 的 ScriptProcessorNode 来获取样本值。这在我们的台式机和笔记本电脑上运行良好,但从我们必须支持的手持平台传输时,我们的音频质量很差。我们将此归因于记录在案的脚本处理器性能问题 ( https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API )。在手持设备上,脚本处理器缓冲区大小为 2048,音频始终存在中断。在下一个最大大小间隔 (4096) 处,音频很流畅(没有中断),但延迟太长(大约两秒)。

我们从 ScriptProcessorNode 得到的结果促使我们对 Audio Worklet 进行了实验。不幸的是,通过我们的工作集实现,音频质量更差:中断和延迟,即使在我们的笔记本电脑上也是如此。我想知道是否有办法调整我们的工作集实现以获得更好的性能,或者我们所经历的是否可以从音频工作集的当前状态(Chromium 问题796330813825836306似乎相关)。

以下是有关代码功能的更多详细信息:

  1. 使用从 getUserMedia 获得的 MediaStream 创建一个 MediaStreamStreamSourceNode。
  2. 将源节点连接到我们的工作节点实现(扩展 AudioWorkletNode)。
  3. 我们的worklet 处理器实现(扩展AudioWorkletProcessor)缓冲作为“输入”参数到达其处理方法的块。
  4. 当缓冲区已满时,使用 MessagePort 将缓冲区内容发送到工作集节点。
  5. Worklet 节点通过 WebSocket 连接传输缓冲区内容。

处理方法如下。var "samples" 是一个 Float32Array,它被初始化为缓冲区大小并被重用。我已经对缓冲区大小进行了一些试验,但似乎没有影响。该方法基于AudioWorklet 的第 4.1 节中的指导:Web 音频的未来以最小化内存分配。

目前在 CentOS 7 上运行 Chrome 72.0.3626.109 的 PC 进行测试。我们的手持设备是 Panasonic FZ-N1,在 Android 6.0.1 上运行 Chrome 72.0.3626.105。

感谢您的阅读以及您可能提供的任何建议。

0 投票
1 回答
278 浏览

reactjs - 在 Wavesurfer 中使用单独的 AudioContext / scriptProcessor 节点

我正在尝试从 Wavesurfer 的默认设置中使用单独的上下文/脚本处理器,这样我就可以独立于播放速率来操纵音频的音高。当我尝试将上下文/脚本处理器作为参数提供并播放音频时,我没有听到任何声音。

我的波形组件:

回放.js

在此设置中,Waveform.play()我可以从 wavesurfer 实例中播放,但不能操纵音高。同样,playbackEngine.play()我可以操纵音高但失去所有 Wavesurfer 功能。

虽然我很确定问题源于 Wavesurfer 和我的播放引擎使用两个单独的 AudioBuffers,但我需要在播放上下文中设置缓冲区,并使用 wavesurfer 渲染波形。

我想看看是否有人可以确认如何使用播放引擎的上下文、脚本处理器和 AudioBuffer 来控制 Wavesurfer 实例(即让 Waveform.play() 播放来自播放引擎的音频,以及更新 Wavesurfer用户界面)。

感谢所有帮助。

0 投票
0 回答
704 浏览

javascript - AudioWorklet 程序中的 bufferSize 导致声音有问题

我的程序正在ScriptProcessorNode使用AudioWorklet. 不幸的是,我没有服务器来测试它,但感谢Google Chrome Labs Audio Worklet Polyfill,我设法让它运行。无论如何,这个想法的目标是通过使用新的替换功能来重新创建与原始功能相似的功能ScriptProcessorNode(因为它现在已被弃用)AudioWorklet

这是代码:

scriptProcessingWorklet.js

ScriptProcessorNodePollyfill.js

问题是我让它工作,但设置一个 bufferSize 并没有输出一个很好的声音结果。当我测试它时, 128 可以bufferSize正常工作,但任何高于 128 的东西都会发出这种故障声音。

我知道问题是AudioWorkletProcessor.process()一次只能调用 128 个样本。我确实考虑过通过返回 true 或 false 来尝试使用活动源标志,但我意识到在阅读返回 false 的规范后不会再次调用 process() 方法。事实上,我不能通过脚本再次调用它来将活动标志从假转换为真。有没有人有任何想法?