html5 音频分贝

### HTML5 Audio 分贝操作与测量

HTML5 的 `<audio>` API 提供了基本的播放控制功能，但对于更复杂的音频处理需求，如分贝（dB）的操作和测量，则需要借助 Web Audio API 来实现[^1]。

Web Audio API 可以通过创建 `AnalyserNode` 节点来获取音频数据并计算其音量级别。下面是一个简单的例子展示如何设置一个分析器节点用于监测音频流中的平均频率强度：

// 创建AudioContext对象
const context = new (window.AudioContext || window.webkitAudioContext)();
let analyser;

function setupAudioControls() {
    const audioElement = document.getElementById('my_audio');
    
    // 将HTML音频元素连接到AudioContext
    const source = context.createMediaElementSource(audioElement);
    
    // 创建analyser节点
    analyser = context.createAnalyser();
    
    // 连接source node 到 analyser node, 并最终连回扬声器
    source.connect(analyser);
    analyser.connect(context.destination);

    // 设置FFT大小影响频谱分辨率，默认2048
    analyser.fftSize = 2048;
}

为了从 `AnalyserNode` 获取当前音频帧的数据，可以使用 `getByteFrequencyData()` 或者 `getFloatTimeDomainData()` 方法填充 Uint8Array 数组。对于分贝级别的估算通常会采用前者，并转换成线性比例再映射至 dB 值范围[-Infinity, 0]:

function getDecibels() {
    let array = new Uint8Array(analyser.frequencyBinCount);
    analyser.getByteFrequencyData(array); 

    // 计算所有频率带的能量均值作为近似响度指标
    var values = 0;
    var length = array.length;
    for(var i = 0; i < length; i++) {
        values += (array[i]*array[i])/length;
    }
    values = Math.sqrt(values);

    // 映射到人类听觉可感知的大致区间内(-96db 至 0db)
    return ((values/255)*3)-96;
}

上述代码片段展示了如何利用 Web Audio API 实现对 HTML5 音轨文件进行实时分贝水平监控的功能[^2]。