Skip to content

Instantly share code, notes, and snippets.

@revolunet
Last active April 29, 2024 11:30
Show Gist options
  • Star 32 You must be signed in to star a gist
  • Fork 7 You must be signed in to fork a gist
  • Save revolunet/e620e2c532b7144c62768a36b8b96da2 to your computer and use it in GitHub Desktop.
Save revolunet/e620e2c532b7144c62768a36b8b96da2 to your computer and use it in GitHub Desktop.
Web Audio streaming with fetch API
//
// loads remote file using fetch() streams and "pipe" it to webaudio API
// remote file must have CORS enabled if on another domain
//
// mostly from http://stackoverflow.com/questions/20475982/choppy-inaudible-playback-with-chunked-audio-through-web-audio-api
//
function play(url) {
var context = new (window.AudioContext || window.webkitAudioContext)();
var audioStack = [];
var nextTime = 0;
fetch(url).then(function(response) {
var reader = response.body.getReader();
function read() {
return reader.read().then(({ value, done })=> {
context.decodeAudioData(value.buffer, function(buffer) {
audioStack.push(buffer);
if (audioStack.length) {
scheduleBuffers();
}
}, function(err) {
console.log("err(decodeAudioData): "+err);
});
if (done) {
console.log('done');
return;
}
read()
});
}
read();
})
function scheduleBuffers() {
while ( audioStack.length) {
var buffer = audioStack.shift();
var source = context.createBufferSource();
source.buffer = buffer;
source.connect(context.destination);
if (nextTime == 0)
nextTime = context.currentTime + 0.01; /// add 50ms latency to work well across systems - tune this if you like
source.start(nextTime);
nextTime += source.buffer.duration; // Make the next buffer wait the length of the last buffer before being played
};
}
}
var url = 'http://www.metadecks.org/software/sweep/audio/demos/beats1.wav?adazdaz'
play(url);
@shreyas-jadhav
Copy link

I'm getting Uncaught (in promise) DOMException: Unable to decode audio data using your code in Chrome console on http://www.metadecks.org/

were you able to solve this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment