如何从音频 URL 绘制分析器

How to draw analyzer from audio url?

本文关键字:绘制 分析器 URL 音频      更新时间:2023-09-26

如何从音频网址绘制分析器?

我正在从 API 服务器获取音频网址 ( http://api.server.com/uploads/files/ecae64b511b1266fa3930731ec379d2dcdcc7546.wav)。我想在画布上绘制这个声音,以下函数适用于 blob 对象(从 suer 录制),但它不适用于 url:

$window.AudioContext = $window.AudioContext || $window.webkitAudioContext;
vm.audioContext = new AudioContext();
function gotStream(stream) {
  vm.inputPoint = vm.audioContext.createGain();
  vm.realAudioInput = vm.audioContext.createMediaStreamSource(stream);
  vm.audioInput = vm.realAudioInput;
  vm.audioInput.connect(vm.inputPoint);
  // audioInput = convertToMono( input );
  vm.analyserNode = vm.audioContext.createAnalyser();
  vm.analyserNode.fftSize = 2048;
  vm.inputPoint.connect(vm.analyserNode);
  vm.audioRecorder = new Recorder(vm.inputPoint);
  var zeroGain = vm.audioContext.createGain();
  zeroGain.gain.value = 0.0;
  vm.inputPoint.connect(zeroGain);
  zeroGain.connect(vm.audioContext.destination);
  updateAnalysers();
}

如果文件与代码来自不同的来源,这可能是 CORS 问题。 如果你不解决这个问题,MediaStreamSource可能只会输出零。