使用WebAudio AnalyserNode.getFloatFrequencyData()来改变BufferSource的音调

// 创建AudioContext对象
var audioContext = new (window.AudioContext || window.webkitAudioContext)();

// 加载音频文件
var audioElement = new Audio('audio.mp3');
var sourceNode = audioContext.createMediaElementSource(audioElement);

// 创建AnalyserNode
var analyserNode = audioContext.createAnalyser();
analyserNode.fftSize = 2048;

// 连接节点
sourceNode.connect(analyserNode);
analyserNode.connect(audioContext.destination);

// 播放音频
audioElement.play();

// 获取频谱数据
var dataArray = new Float32Array(analyserNode.frequencyBinCount);
analyserNode.getFloatFrequencyData(dataArray);

// 改变音调
var playbackRate = 1.0; // 初始播放速度
var pitchShift = 2; // 音调变化量
var bufferSourceNode = audioContext.createBufferSource();
bufferSourceNode.buffer = audioContext.createBuffer(1, audioElement.duration * audioContext.sampleRate, audioContext.sampleRate);
bufferSourceNode.buffer.getChannelData(0).set(audioElement.buffer.getChannelData(0));

bufferSourceNode.playbackRate.value = playbackRate * Math.pow(2, pitchShift / 12);
bufferSourceNode.connect(audioContext.destination);
bufferSourceNode.start();

// 停止音频
setTimeout(function() {
  bufferSourceNode.stop();
}, audioElement.duration * 1000);