问题标签 [audio-worklet]

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 回答
875 浏览

javascript - 有没有办法使用 Web Audio API 重新采样音频流?

我目前正在使用 Web Audio API 一点点。我设法“读取”了一个麦克风并将它播放到我的扬声器上,这非常无缝。

使用 Web Audio API,我现在想将传入的音频流(又名麦克风)从 44.1kHz 重新采样到 16kHz。16kHz,因为我正在使用一些需要 16kHz 的工具。由于 44.1kHz 除以 16kHz 不是整数,我相信我不能简单地使用低通滤波器和“跳过样本”,对吧?

我还看到有人建议使用.createScriptProcessor(),但由于它已被弃用,我觉得使用它有点不好,所以我现在正在寻找一种不同的方法。另外,我不一定需要audioContext.Destination听到它!如果我得到重采样输出的“原始”数据,仍然可以。


到目前为止我的方法

  • 创建AudioContext({sampleRate: 16000})--> 会引发错误:“当前不支持从具有不同采样率的 AudioContexts 连接 AudioNodes。”
  • 使用OfflineAudioContext--> 但它似乎没有流的选项(仅适用于缓冲区)
  • 使用AudioWorkletProcessor重新采样。在这种情况下,我认为我可以使用处理器对输入进行实际重新采样并输出“重新采样”的源。但我真的不知道如何重新采样它。

main.js

resample_proc.js(假设只有一个输入和输出通道)

谢谢!

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() 方法。事实上,我不能通过脚本再次调用它来将活动标志从假转换为真。有没有人有任何想法?

0 投票
1 回答
212 浏览

rust - 在 wasm-bindgen 中扩展 AudioWorkletProcessor?

有关如何rust -> wasm使用 wasm-bindgen 在流程中使用现有 javascript Web 系统的文档非常简单。简而言之:

  1. 将所需的功能列为依赖项
  1. 通过 web_sys 访问,并从那里正常对待它们。

链接到完整示例


虽然这种方法适用于大多数 Web 系统,但对于需要您扩展类的系统来说并不那么简单。在这种情况下,我正在尝试使用AudioWorkletProccessorwasm-bindgen

在标准用法中,您应该扩展AudioWorkletProcessor类,然后注册它。MDN 示例


我该如何解决这个问题?首先我需要AudioWorkletProcessor在 Rust 中扩展(它不做普通的类和继承),覆盖它的process()功能。然后我需要确保registerProcessor()注入到我的生锈空间。


编辑:关于扩展的 WASM 文档

0 投票
0 回答
98 浏览

javascript - 如何在 JS worklet 发布消息调用中传递函数?

我需要我的工作集来使用调用 TS 文件中的函数。因为在postMessage中只允许使用字符串和数字。我发现很难传递一个函数。这甚至可能吗?

calling.ts

worklet.js

更多细节:我需要传递函数的原因是因为它是我通过 WebAssembly 获得的函数。它实际上是一个用 C 代码编写的函数。我使用 emcc 编译器将其编译为 WASM 文件,并从服务器提供该文件。在浏览器中使用 WebAssembly 模块,我得到了这个功能。

0 投票
1 回答
264 浏览

google-chrome - AudioWorklet.addModule 是否已登录 Chrome 网络控制台?

我正在通过 AudioWorklet.addModule(githubUrl) 从 Github 加载示例模块来测试一些音频工作集代码。但是,当我查看开发人员设置中的网络选项卡时,我没有看到对 Github 的网络请求。我知道它正在发出请求,因为在我切换到使用 raw.githubusercontent 地址之前它给出了一个 CORS 错误(现在它正在给出Uncaught (in promise) DOMException: The user aborted a request)。我希望能够检查网络调用返回的内容,以便帮助诊断问题。

0 投票
1 回答
128 浏览

javascript - 如何将音频工作集连接到网页?

我正在尝试将网页连接到音频工作集(按照这个演示但我被卡住了。

有人可以帮忙吗?

这是我到目前为止的代码。这些文件都在同一个文件夹中,但它们不记录任何内容。

索引.HTML

索引.JS

测试处理器.JS

0 投票
1 回答
100 浏览

javascript - 简单的 WebAudioWorklet 生成断断续续的音频

我使用的是 Firefox 84.0.1、Windows 10、x86_64。我有一个非常基本的WebAudioWorklet合成器,可以将键映射到音符的频率。当一个键被按住时,它会产生非常断断续续的音频。这让我认为没有足够的音频样本排队等待扬声器播放,因此音频会进出。但是,在音频处理方面,我正在执行一项非常低强度的任务。结果,我觉得默认Worklet设置应该能够处理这个问题。这是我的代码:

syn.js

syn-worklet.js

0 投票
1 回答
773 浏览

angular - 在 AudioWorkletProcessor 中调用 wasm 模块函数的最佳方法?

我正在使用 Angular 开发视频会议 Web 应用程序。我试图在我的AudioWorkletProcessor课堂上调用一些 wasm 函数。但是,我非常坚持如何将 wasm 模块传递给AudioWorkletProcessor然后调用这些函数。我能够从 emcc 生成的 js 文件中实例化 wasm 模块(使用命令:)emcc test.cpp -s WASM=1 -s MODULARIZE=1,然后options.processorOptions在我们构造AudioWorkletNode;时尝试通过参数传递这个模块。但是,似乎 Function 对象无法传递,因为它提供了DataCloneError. 有没有更好的方法来实例化 wasm 模块并将其传递给工作集处理器以便我可以使用它的功能?

audio.service.ts 的代码:

0 投票
1 回答
324 浏览

javascript - 如何从工作集中访问全局/窗口范围?(JavaScript 前端)

我创建了一个 AudioWorkletProcessor 并像这样激活它:

在 testworklet.js 我定义

但是这段代码无法访问 WebSocket,因为 WebSocket 是在“窗口”范围内,而代码是在 AudioWorkletGlobalScope 下运行的。

我如何使用javascript?

0 投票
1 回答
38 浏览

web-audio-api - Audioworklets 和音高

我最近开始使用 audioworklet 并试图弄清楚如何从输入中确定音高。我找到了一个用于脚本处理器的简单算法,但输入值与脚本处理器不同并且不起作用。加上每个输入数组只有 128 个单元。那么,如何使用 audioworklet 确定音高?作为一个额外的问题,这些值与实际输入的音频有什么关系?