在专业音乐制作和母带处理中，“立体声声像拓宽（Stereo Widening）”是一把让人又爱又恨的利刃。恰到好处的声场宽度能让合成器音色和环境声效瞬间脱离耳机扬声器的物理束缚，营造出浩瀚的空间沉浸感；但如果处理不当，粗暴地拉大左右声道的相位差，就会引发严重的相位抵消（Phase Cancellation）——当音频在手机单声道扬声器或特定公播设备上播放时，居中的人声与贝斯低音会因为干涉而直接凭空消失。
在前端开发 Web 音频工作站（DAW）、互动展台音效或是高品质音乐播放器时，很多人只会简单调用 StereoPannerNode 来调整左右平衡。但想要实现母带级别的声场操控，必须引入声学领域极其经典的 Mid-Side（中/侧，简称 M/S）处理架构。
借助 Web Audio API 的基础音频节点拓扑，我们可以在浏览器端完全用原生硬件加速图（AudioGraph）搭建出一套零延迟、低 CPU 损耗且具备单声道保护机制的 Mid-Side 拓宽处理器。
Mid-Side 编码与解码声学数学
在标准立体声（Left/Right）模型中，左声道 $L$ 和右声道 $R$ 是直接映射到扬声器的独立信号。而 Mid-Side 处理则通过代数变换，将立体声分解为两个具有明确物理特性的分量：
- Mid 信号（中置信号，合相分量）：
$$M = \frac{L + R}{2}$$
它包含了左右声道完全相同的内容（通常是主唱、底鼓、贝斯根音），听觉上来自正中央。 - Side 信号（侧向信号，差相分量）：
$$S = \frac{L - R}{2}$$
它包含了左右声道的差异信息（如立体声混响尾音、声像摆到极左极右的双吉他排布），代表了声音的“空间宽度”。
对 $M$ 和 $S$ 分别进行独立的动态增益缩放（例如放大 $S$ 的振幅 $Gain_S$），随后再通过逆变换矩阵解码还原为立体声左右输出：
$$L_{out} = M + S \cdot Gain_S$$
$$R_{out} = M - S \cdot Gain_S$$
当 $Gain_S > 1$ 时，侧向空间信息被强化，听觉声场显著拓宽；当 $Gain_S = 0$ 时，立体声完全坍缩为纯单声道。
单声道低频保护法则：Bass Mono Maker
在声学工程里有一条铁律：120Hz 以下的低频必须保持绝对的单声道（Mono）。因为低频声波波长极长（100Hz 对应约 3.4 米），如果在极低频引入明显的左右相位差，不仅无法被人耳定位（人耳对低频声源方向感知极迟钝），反而会在声波叠加时造成扬声器振膜无效过载，或者在单声道合并时产生致命的低频消顶。
因此，一个合格的 M/S 拓宽器，必须在 Side 支路上并联一个高通滤波器（High-pass Filter，截止频率约 120Hz~150Hz），切除 Side 信号中的次低频成分，确保贝斯与底鼓的能量牢牢钉在声场正中央。
Web Audio DSP 拓扑节点图
为了在 Web Audio 中实现上述逻辑，我们需要利用 ChannelSplitterNode 拆分声道，利用反相 GainNode（增益为 -1）实现代数相减，配合双二阶滤波器处理侧向低频，最后通过 ChannelMergerNode 合并输出。
┌─── [Gain: 0.5] ──────────────────────┐
┌── [L] ┤ ├─ [Sum: Mid] ─────────────┐
│ └─── [Gain: 0.5] ─┐ │ │
[Input] ────┤ ├─ (+) ──────────────┘ ├─ (+) ─── [L_out]
(Stereo) │ ┌─── [Gain: 0.5] ─┘ │
└── [R] ┤ │
└─── [Gain: -0.5] ── [Sum: Side] ── [Highpass Filter] ── [Gain: Width] ─── (-) ─── [R_out]
Mid-Side 拓宽器核心 TypeScript 实现
下面的代码封装了一个完整的 Mid-Side 拓宽模块，支持平滑的宽度系数调节与实时单声道相关性监测：
export interface StereoWidenerOptions {
width: number; // 宽度倍率：0.0 (纯单声道) ~ 1.0 (原声) ~ 2.5 (超宽立体声)
lowCutFrequency: number; // Side 信号低切频率，默认 130Hz
}
export class MidSideStereoWidener {
private ctx: AudioContext;
public input: GainNode;
public output: GainNode;
// 核心节点
private splitter: ChannelSplitterNode;
private merger: ChannelMergerNode;
private midGain: GainNode;
private sideGain: GainNode;
private sideHighPass: BiquadFilterNode;
private sideInverter: GainNode;
private currentWidth: number = 1.0;
constructor(context: AudioContext, options: Partial<StereoWidenerOptions> = {}) {
this.ctx = context;
const width = options.width ?? 1.0;
const lowCut = options.lowCutFrequency ?? 130;
// 1. 初始化端点
this.input = this.ctx.createGain();
this.output = this.ctx.createGain();
// 2. 声明声道拆分与合并器
this.splitter = this.ctx.createChannelSplitter(2);
this.merger = this.ctx.createChannelMerger(2);
// 3. 构建 M/S 编码节点
// Mid = 0.5 * L + 0.5 * R
const lToMid = this.ctx.createGain();
lToMid.gain.value = 0.5;
const rToMid = this.ctx.createGain();
rToMid.gain.value = 0.5;
this.midGain = this.ctx.createGain(); // 中置总干线
// Side = 0.5 * L - 0.5 * R
const lToSide = this.ctx.createGain();
lToSide.gain.value = 0.5;
const rToSide = this.ctx.createGain();
rToSide.gain.value = -0.5; // 相位反转实现相减
// Side 信号塑形：切除低频并控制宽度增益
this.sideHighPass = this.ctx.createBiquadFilter();
this.sideHighPass.type = 'highpass';
this.sideHighPass.frequency.value = lowCut;
this.sideHighPass.Q.value = 0.707; // Butterworth 阻尼特性
this.sideGain = this.ctx.createGain();
this.sideGain.gain.value = width;
// 解码阶段 R 声道反相减节点: R_out = Mid - Side = Mid + (-1 * Side)
this.sideInverter = this.ctx.createGain();
this.sideInverter.gain.value = -1.0;
// 4. 连通 AudioGraph
this.input.connect(this.splitter);
// 分路并入 Mid
this.splitter.connect(lToMid, 0);
this.splitter.connect(rToMid, 1);
lToMid.connect(this.midGain);
rToMid.connect(this.midGain);
// 分路并入 Side
this.splitter.connect(lToSide, 0);
this.splitter.connect(rToSide, 1);
lToSide.connect(this.sideHighPass);
rToSide.connect(this.sideHighPass);
this.sideHighPass.connect(this.sideGain);
// 逆变换解码并入 Merger
// 左声道: L_out = Mid + Side
this.midGain.connect(this.merger, 0, 0);
this.sideGain.connect(this.merger, 0, 0);
// 右声道: R_out = Mid - Side
this.midGain.connect(this.merger, 0, 1);
this.sideGain.connect(this.sideInverter);
this.sideInverter.connect(this.merger, 0, 1);
// 输出挂载
this.merger.connect(this.output);
}
/**
* 平滑调节立体声宽度，利用 AudioParam 原生插值避免爆音 (Click/Pop)
*/
public setWidth(width: number, transitionTimeSec: number = 0.05): void {
const clampedWidth = Math.max(0, Math.min(width, 2.5));
this.currentWidth = clampedWidth;
const now = this.ctx.currentTime;
this.sideGain.gain.cancelScheduledValues(now);
this.sideGain.gain.linearRampToValueAtTime(clampedWidth, now + transitionTimeSec);
}
/**
* 彻底销毁节点链路，释放底层声卡硬件句柄
*/
public dispose(): void {
this.input.disconnect();
this.splitter.disconnect();
this.midGain.disconnect();
this.sideHighPass.disconnect();
this.sideGain.disconnect();
this.sideInverter.disconnect();
this.merger.disconnect();
this.output.disconnect();
}
}
母带听感调试与相位相关度警惕
在接入真实音轨压测时，有两个核心声学调试细节必须死磕：
- 相位相关仪（Phase Correlation Meter）监测：真正的立体声信号，其左右声道的互相关系数（Correlation）应当始终落在 $[+0.2, +0.9]$ 之间。如果系数跌破 0 甚至趋近 -1，说明左右声道存在大面积的反相能量，此时在单声道下听感会瞬间空洞、干瘪。开发音频前端时，建议挂载一个双通道
AnalyserNode实时计算 $\sum(L \cdot R) / \sqrt{\sum L^2 \cdot \sum R^2}$，一旦发现相关度持续变负，立即限制sideGain的最大值。 - 避免盲目叠加微延迟（Haas Effect）：很多人喜欢用 15ms~30ms 的延时去制造左右声像宽度（哈斯效应）。但微秒级的延迟必然带来梳状滤波（Comb Filtering）效应，让特定频点的声音被物理过滤。相比之下，纯代数 M/S 矩阵拓宽法不引入时钟延迟，频率响应更加平直通透。
写出好的音频架构，既需要对 Web Audio 原生节点数据流向的精确控制，更需要一双对声学物理规律充满敬畏的耳朵。只有把底层的物理约束做扎实，声音的宽度才能真正震撼人心。
转载自 CSDN-专业IT技术社区
原文链接：https://blog.csdn.net/2609_95049439/article/details/167921620
