如何在不播放音频文件的情况下获取其每秒的分贝值？

我懂你现在的困扰——之前的代码必须播放音频才能拿到分贝数据，试着去掉audio.play()后却只得到一堆0，而且还希望把这些分贝值存进数组里对吧？其实问题出在MediaElementSource的工作机制上：它必须依赖音频元素处于播放状态，才能把音频数据推送到处理节点。咱们换个更直接的方式，不用HTMLAudioElement，直接用AudioContext解码音频文件的原始数据，就能在完全不播放的前提下提取分贝啦！

完整实现代码 #

export default function getAudio(a) {
  document.querySelector(`${a}`).addEventListener(
    "change",
    function () {
      const reader = new FileReader();
      reader.onload = (e) => {
        // 读取文件的ArrayBuffer，比DataURL更适合音频解码
        const audioBuffer = e.target.result;
        processAudio(audioBuffer);
      };
      // 以原始二进制格式读取文件
      reader.readAsArrayBuffer(this.files[0]);
    },
    false
  );

  async function processAudio(arrayBuffer) {
    const audioCtx = new AudioContext();
    // 解码音频文件，获取包含原始样本的AudioBuffer
    const decodedBuffer = await audioCtx.decodeAudioData(arrayBuffer);
    const channelData = decodedBuffer.getChannelData(0); // 取左声道数据（多声道可按需调整）
    const sampleRate = decodedBuffer.sampleRate; // 音频采样率（例如44100Hz）
    const samplesPerSecond = sampleRate; // 每秒对应的样本数量
    const totalSeconds = decodedBuffer.duration; // 音频总时长
    const decibelArray = [];

    // 遍历每一秒的音频片段计算分贝
    for (let sec = 0; sec < totalSeconds; sec++) {
      const startSample = sec * samplesPerSecond;
      const endSample = Math.min((sec + 1) * samplesPerSecond, channelData.length);
      const sampleChunk = channelData.slice(startSample, endSample);

      // 计算当前片段的RMS（均方根，衡量音频能量的核心指标）
      let sum = 0;
      for (const sample of sampleChunk) {
        sum += sample * sample;
      }
      const rms = Math.sqrt(sum / sampleChunk.length);
      
      // 转换为标准分贝值（避免log10(0)报错，加极小值兜底）
      const decibels = 20 * Math.log10(rms || 0.000001);
      // 如果你习惯之前的相对能量显示方式，也可以用：const decibels = rms * 100;
      
      decibelArray.push({
        second: Math.floor(sec) + 1, // 标记是第N秒
        decibel: decibels.toFixed(2) // 保留两位小数，提升可读性
      });
    }

    console.log("每秒分贝值数组：", decibelArray);
    return decibelArray;
  }
}

// 在其他脚本中调用（传入文件选择器的选择器）
getAudio('input');

关键逻辑说明 #

• 为什么抛弃HTMLAudioElement？
  MediaElementSource是绑定音频播放流的，只有播放触发时才会向处理节点推送数据；而decodeAudioData直接解码文件得到原始样本数据，完全脱离播放流程，自然不需要播放音频。
• ArrayBuffer的优势
  用readAsArrayBuffer读取原始二进制数据，比readAsDataURL更高效，也更适配AudioContext的解码需求。
• 分贝计算细节
  先按采样率拆分出每秒的样本块，计算每个块的RMS，再通过20 * log10(rms / 最大振幅)转换为标准分贝值（音频样本范围是[-1,1]，所以最大振幅取1）。如果只是需要相对能量参考，也可以保留你之前的rms*100方式。
• 数组存储
  把每一秒的时间点和对应的分贝值封装成对象存入数组，方便后续的数据分析或展示。

解答你之前的疑问 #

你之前去掉audio.play()后得到全0，是因为MediaElementSource没有播放触发的话，不会向ScriptProcessorNode传递任何有效音频数据，evt.inputBuffer里全是默认的0值，计算结果自然都是0啦。

备注：内容来源于stack exchange，提问作者user22191183