有沒有辦法使用Javascript或任何其他網絡語言捕獲瀏覽器的音頻？

Question

我想創建一個顯示交互式視覺效果的簡單網站，我希望其中一些是音頻驅動的。 我希望訪客能夠用他們自己選擇的音樂來驅動視覺效果。 除了從麥克風輸入音頻輸入之外，我很難找到其他任何文檔。

例如，我的網頁（在標簽1中）運行javascript代碼X，允許我處理在Web瀏覽器的另一個選項卡中播放的音頻流。 這可能嗎？

Answer 1

如果我正確理解您的問題，您希望從當前選項卡之外的來源捕獲音頻。

作為W3C規范的一部分，沒有這樣的api，可能是由於存在與用戶完整性有關的問題。 由於瀏覽器基本上是在執行外部代碼，因此瀏覽器往往是嚴格的沙盒並且需要同意以防止任何違反用戶隱私的行為。

如果您或該用戶有權訪問媒體，請嘗試使用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
} 

如果您只想要音頻流的可視化，您可以使用javascript插件，例如在此處輸入鏈接描述