Question

我想创建一个显示交互式视觉效果的简单网站，我希望其中一些是音频驱动的。我希望访客能够用他们自己选择的音乐来驱动视觉效果。除了从麦克风输入音频输入之外，我很难找到任何其他文档。

例如，我的网页（在标签1中）运行的是javascript代码X，它允许我处理在网络浏览器的另一个标签页中播放的音频流。这可能吗？

Answer 1

如果我正确理解您的问题，您希望从当前标签之外的来源捕获音频。

作为W3C the spec的一部分，没有这样的api，可能是由于存在与用户完整性有关的问题。由于浏览器基本上是在执行，因此外部代码浏览器往往是sandboxed，并且需要同意以防止任何违反用户隐私的行为。

如果您或该用户有权访问该媒体，请尝试使用Audio和File API。如果你提到的那些既不是也不使用输入音频捕获API就足够了，你或者必须转向创建浏览器扩展或者完全转向另一个平台。

Answer 2

您可以使用WebRtc API

获取麦克风流

if (!navigator.getUserMedia)
  navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
  navigator.mozGetUserMedia || navigator.msGetUserMedia;

if (navigator.getUserMedia) {
    navigator.getUserMedia({audio:true}, success, function(e) {
    });
}

...............

 function success(e) {
      audioContext = window.AudioContext || window.webkitAudioContext;
      context = new audioContext();

      // the sample rate is in context.sampleRate
      audioInput = context.createMediaStreamSource(e);

      var bufferSize = 2048;
      recorder = context.createScriptProcessor(bufferSize, 1, 1);
      recorder.onaudioprocess = function(e){

        console.log ('recording');
        var left = e.inputBuffer.getChannelData(0);
    // stream
        window.Stream.write(convertoFloat32ToInt16(left));
  }
  audioInput.connect(recorder)
  recorder.connect(context.destination); 


function convertoFloat32ToInt16(buffer) {
  var l = buffer.length;
  var buf = new Int16Array(l)
  while (l--) {
    buf[l] = buffer[l]*0xFFFF;    //convert to 16 bit
  }
  return buf.buffer
}

如果您只想要音频流的可视化，可以使用enter link description here

等javascript插件

有没有办法使用Javascript或任何其他网络语言捕获浏览器的音频？

2 个答案: