如何确定 <video> 标签中的音频通道数？ (HTML5)

Question

我想将 AnalyserNode 附加到视频元素的每个音频通道，以便进行一些音频可视化。

我的代码目前可以工作，除了 AudioContext 和 MediaElementAudioSourceNode 都报告通道数为 2，而不管视频中实际有多少音频通道。

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

在我正在测试的情况下，我生成了一个带有 1 个包含 8 个通道的音频流的 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();
}