是否可以使用 WebAudio 处理所有传出的浏览器音频？答案

【问题标题】：Is it possible to use WebAudio to process all outgoing browser audio?是否可以使用 WebAudio 处理所有传出的浏览器音频？
【发布时间】：2014-03-17 22:25:34
【问题描述】：

我正在尝试通过将一些 JavaScript 注入页面来构建一些代码来处理在其他页面中找到的音频。我的印象是我可以创建一个 AudioContext 然后创建一个 onaudioprocess 函数，它会被所有传出的音频调用。

var AudioContext = window.AudioContext || window.webkitAudioContext;
var context = new AudioContext();
var proc = context.createScriptProcessor(16384, 0, 2);

proc.onaudioprocess = function (event) {
    var buffer= event.outputBuffer.getChannelData(0);
    for( var iSample in buffer )
        if( buffer[iSample] > 0.0 )
            alert( "SDRFSDF" );
};

proc.connect(context.destination);

我设置了这个，我从来没有得到任何非零样本，即使我正在播放视频或其他音频源。我是不是忘记挂东西了？这甚至可能吗？

【问题讨论】：

标签： javascript audio web-audio-api

【解决方案1】：

不，您无法使用 Web Audio API 访问页面中的“所有传出音频”（例如 Flash 视频）。

如果页面上有 HTML 视频或音频标签，您可以使用 AudioContext#createMediaElementSource，假设媒体元素的 src 来自与页面相同的来源（或者如果媒体资产使用 CORS 提供标题）。

【讨论】：

我可以使用其他 API 吗？
不。至少我不知道。

【解决方案2】：

您当然可以获取页面的所有和元素，并将其通过管道传输到 Web Audio，就像这样（以您的示例为基础）：

var av = document.querySelectorAll('audio, video');
// for each source, connect it to the script processor node
for (var i = 0; i < av.length; i++) {
    context.createMediaElementSource(av[i]).connect(proc);
}`

这只有在源是同源的情况下才有效，或者如果服务器使用 CORS 标头进行响应。不过，这只适用于音频和视频元素实际上位于 dom 中的情况。

【讨论】：