Converting a Float32Array of decoded samples to an AudioBuffer

Question

Because one of the browsers I'm trying to support doesn't allow me to decode a specific codec using AudioContext.decodeAudioData() I'm using Aurora.js to decode a audio files.

How can I change the decoded samples received from Aurora.js into an AudioBuffer I can actually use to playback the audio?

This is my code so far:

var AudioContext = (window.AudioContext || window.webkitAudioContext);
var context = new AudioContext();
var segmentUrls = [
    '/segments/00.wav',
    '/segments/05.wav',
    '/segments/10.wav',
    '/segments/15.wav',
    '/segments/20.wav',
    '/segments/25.wav',
    '/segments/30.wav',
    '/segments/35.wav',
    '/segments/40.wav',
    '/segments/45.wav',
    '/segments/50.wav',
    '/segments/55.wav'
];

Promise.all(segmentUrls.map(loadSound))
    .then(function(buffers) {
        var startAt = 0;
        buffers.forEach(function(buffer) {
            playSound(startAt, buffer);
            startAt += buffer.duration;
        });
    })
    .catch(function(err) {
        console.error(err);
    });

function playSound(offset, buffer) {
    var source = context.createBufferSource();
    source.buffer = buffer;
    source.connect(context.destination);
    source.start(offset);
}

function loadSound(url) {
    return new Promise(function(resolve, reject) {
        var request = new XMLHttpRequest();
        request.open('GET', url, true);
        request.responseType = 'arraybuffer';

        request.onload = function onLoad() {
            resolve(decodeAudioData(request.response));
        };

        request.onerror = function onError() {
            reject('Could not request file');
        };
        request.send();
    });
}

function decodeAudioData(audioData) {
    return new Promise(function(resolve, reject) {
        var asset = AV.Asset.fromBuffer(audioData);
        asset.decodeToBuffer(function(buffer) {
            // Create an AudioBuffer here
        });
    });
}

score 1 · Answer 1 · answered Jun 11 '14 at 18:22

1

You'll have to create an AudioBuffer of the appropriate size and # of channels, and copy the data from one Float32 buffer to another.

answered Jun 11 '14 at 18:22

cwilso

13,610
1
30
35

score 0 · Answer 2 · answered Oct 28 '15 at 12:19

Here is the MDN code snippet to put data in an AudioBuffer and then play it:

https://developer.mozilla.org/en-US/docs/Web/API/AudioBuffer

// Stereo
var channels = 2;

// Create an empty two second stereo buffer at the
// sample rate of the AudioContext
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();    
var frameCount = audioCtx.sampleRate * 2.0;

var myArrayBuffer = audioCtx.createBuffer(channels, frameCount, audioCtx.sampleRate);

button.onclick = function() {
  // Fill the buffer with white noise;
  // just random values between -1.0 and 1.0
  for (var channel = 0; channel < channels; channel++) {
    // This gives us the actual array that contains the data
    var nowBuffering = myArrayBuffer.getChannelData(channel);
    for (var i = 0; i < frameCount; i++) {
      // Math.random() is in [0; 1.0]
      // audio needs to be in [-1.0; 1.0]
      nowBuffering[i] = Math.random() * 2 - 1;
    }
  }

  // Get an AudioBufferSourceNode.
  // This is the AudioNode to use when we want to play an AudioBuffer
  var source = audioCtx.createBufferSource();

  // set the buffer in the AudioBufferSourceNode
  source.buffer = myArrayBuffer;

  // connect the AudioBufferSourceNode to the
  // destination so we can hear the sound
  source.connect(audioCtx.destination);

  // start the source playing
  source.start();

}

Despite what this code snippet (from MDN) appears to do, for some reason audio only comes out of the right speaker on Firefox (tested 54.0.1). (Chrome and Edge are fine) — Kosso, Aug 07 '17 at 14:37
where will I put my Float32Array object in this snippet? Let's say I have an object named **floatObj** of type Float32Array which I wanna palce in **source.buffer** — Ali Sajid, Jul 30 '19 at 14:08
@AliSajid did you ever figure this out? I'm trying to do the exact same thing — James P, Sep 12 '19 at 00:36
@JamesP I couldn't. I was converting my buffer to Float32Array, which didn't work so I just added Wav header in that buffer and assigned it to source.buffer — Ali Sajid, Sep 13 '19 at 10:27

Converting a Float32Array of decoded samples to an AudioBuffer

2 Answers2