如何在Wavesurfer 7中静音或放大左/右声道？

Wavesurfer 7重构了后端API，移除了旧版本的backend.buffer、setFilters等接口，需要直接通过Web Audio API的节点来实现声道控制——核心思路是用ChannelSplitter分离左右声道，配合Gain节点单独调整音量，最后用ChannelMerger合并输出。

实现步骤 #

1. 初始化Wavesurfer并创建音频处理节点

// 创建Wavesurfer实例
const wavesurfer = WaveSurfer.create({
  container: '#waveform',
  waveColor: '#4F4A85',
  progressColor: '#383351',
});

// 获取Wavesurfer的AudioContext，创建声道处理节点
const audioContext = wavesurfer.getAudioContext();
const splitter = audioContext.createChannelSplitter(2);
const merger = audioContext.createChannelMerger(2);
const leftGain = audioContext.createGain();
const rightGain = audioContext.createGain();

// 音频加载完成后连接节点链
wavesurfer.on('ready', () => {
  // 构建音频流路径：播放器输出 → 声道分离 → 音量控制 → 声道合并 → 扬声器
  wavesurfer.getMediaElement().audioSource.connect(splitter);
  splitter.connect(leftGain, 0);
  splitter.connect(rightGain, 1);
  leftGain.connect(merger, 0, 0);
  rightGain.connect(merger, 0, 1);
  merger.connect(audioContext.destination);
});

2. 声道控制函数

// 静音左声道，保留右声道正常音量
function muteLeftChannel() {
  leftGain.gain.setValueAtTime(0, audioContext.currentTime);
  rightGain.gain.setValueAtTime(1, audioContext.currentTime);
}

// 静音右声道，保留左声道正常音量
function muteRightChannel() {
  rightGain.gain.setValueAtTime(0, audioContext.currentTime);
  leftGain.gain.setValueAtTime(1, audioContext.currentTime);
}

// 放大左声道音量（示例为2倍，可按需调整数值）
function boostLeftVolume() {
  leftGain.gain.setValueAtTime(2, audioContext.currentTime);
  rightGain.gain.setValueAtTime(1, audioContext.currentTime);
}

// 恢复双声道默认音量
function restoreBothChannels() {
  leftGain.gain.setValueAtTime(1, audioContext.currentTime);
  rightGain.gain.setValueAtTime(1, audioContext.currentTime);
}

使用示例 #

可以将这些函数绑定到按钮点击事件，快速调用控制逻辑：

<button onclick="muteLeftChannel()">静音左声道</button>
<button onclick="muteRightChannel()">静音右声道</button>
<button onclick="boostLeftVolume()">放大左声道</button>
<button onclick="restoreBothChannels()">恢复正常</button>

内容的提问来源于stack exchange，提问作者AJAY MAURYA