如何確定一個音頻通道的數量<video>標簽？ (HTML5)

Question

我想將 AnalyserNode 附加到視頻元素的每個音頻通道，以便我可以進行一些音頻可視化。

我的代碼目前有效，除了 AudioContext 和 MediaElementAudioSourceNode 都報告通道數為 2，而不管視頻中實際有多少音頻通道。

let context = new AudioContext();
let source = context.createMediaElementSource(videoElement);
let srcChannelCount = source.channelCount;  // Always 2!!!

在我測試的情況下，我生成了一個包含 8 個通道的 1 個音頻流的 webm 文件。 如果我將 srcChannelCount 變量硬編碼為特定數量的通道（例如let srcChannelCount = 8; ），我的可視化會正確顯示 8 個通道中每個通道的數據，但是我希望代碼能夠檢測基於視頻的通道數文件。

誰能告訴我如何確定實際的源音頻通道數？

Answer 1

您可以使用音頻緩沖區的 numberOfChannels 屬性。 但是，您需要使用 decodeAudioData(audioData, function(buffer) {} 函數和 xhr 請求而不是音頻元素。示例如下：

function getData( currSource ) {

  source = audioCtx.createBufferSource();  
  var request = new XMLHttpRequest();
  request.open('GET', currSource , true);  //for example 'sample.ogg'
  request.responseType = 'arraybuffer';

  request.onload = function() {
    var audioData = request.response;

    audioCtx.decodeAudioData(audioData, function(buffer) {
        source.buffer = buffer;
        
        console.log('detected '+buffer.numberOfChannels+' audio channels in the selected file');
        }, //end succes        
      
        function(e){
          console.log('error: '+e); //log error
        }
        
        ).catch(error => {
            console.log('failed');
        });
          
      }//end request loaded
  request.send();
}