声音无法通过网络音频正确播放答案

【问题标题】：Sound wont play correctly with Web Audio声音无法通过网络音频正确播放
【发布时间】：2021-01-13 13:35:15
【问题描述】：

我正在尝试使用 AudioContext 播放 wav 文件 - 在加载 <audio> 标签时它可以正常播放（如 jsfiddle 所示），但在使用 AudioContext 时播放不正确。

var startButton = document.getElementById('start-stream');
var wav = new wavefile.WaveFile();
startButton.onclick = function() {
  audioCtx = new AudioContext();
  wav.fromBase64(mydata);

  buffer = audioCtx.createBuffer(1, audioCtx.sampleRate * 3, audioCtx.sampleRate);

  // add audio data to buffer
  buffer.getChannelData(0).set(wav.getSamples());

  source = audioCtx.createBufferSource();
  source.buffer = buffer;
  source.connect(audioCtx.destination);
  source.start();
};

小提琴在这里：https://jsfiddle.net/Persiancoffee/6v8dLt3f/7/

【问题讨论】：

标签： javascript html5-audio web-audio-api audiocontext

【解决方案1】：

Web Audio API 的 decodeAudioData() 函数可以解码 WAV 文件，这就是为什么您不需要任何外部库来处理这个用例。它将为您生成一个AudioBuffer。

startButton.onclick = async function () {
    audioCtx = new AudioContext();

    const arrayBuffer = Uint8Array.from(
        atob(mydata),
        (character) => character.charCodeAt(0)
    ).buffer;

    buffer = await audioCtx.decodeAudioData(arrayBuffer);
    
    source = audioCtx.createBufferSource();
    source.buffer = buffer;
    source.connect(audioCtx.destination);
    source.start();
};

这里是您的小提琴更新版本的链接：https://jsfiddle.net/pzx0vg89/。

【讨论】：