Play raw audio with JavaScript

Question

I have a stream of numbers like this

-0.00015259254737998596,-0.00009155552842799158,0.00009155552842799158,0.00021362956633198035,0.0003662221137119663,0.0003967406231879635,0.00024414807580797754,0.00012207403790398877,0.00012207403790398877,0.00012207403790398877,0.0003357036042359691,0.0003357036042359691,0.00018311105685598315,0.00003051850947599719,0,-0.00012207403790398877,0.00006103701895199438,0.00027466658528397473,0.0003967406231879635,0.0003967406231879635,0.0003967406231879635,0.0003967406231879635,0.0003967406231879635,0.0003662221137119663,0.0004882961516159551,0.0004577776421399579,0.00027466658528397473,0.00003051850947599719,-0.00027466658528397473....

Which supposedly represent an audio stream. I got them from here and I've transmitted them over the web, now I'm trying to play the actual sound and I got a snippet from here but I'm getting Uncaught (in promise) DOMException: Unable to decode audio data

I feel like I'm missing quite a lot I just expect this to work like magic and it just could not be the case..

My code

var ws = new WebSocket("ws://....");
ws.onmessage = function (event) {
  playByteArray(event.data);
}

var context = new AudioContext();
function playByteArray(byteArray) {

  var arrayBuffer = new ArrayBuffer(byteArray.length);
  var bufferView = new Uint8Array(arrayBuffer);
  for (var i = 0; i < byteArray.length; i++) {
    bufferView[i] = byteArray[i];
  }

  context.decodeAudioData(arrayBuffer, function (buffer) {
    buf = buffer;
    play();
  });
}

// Play the loaded file
function play() {
  // Create a source node from the buffer
  var source = context.createBufferSource();
  source.buffer = buf;
  // Connect to the final output node (the speakers)
  source.connect(context.destination);
  // Play immediately
  source.start(0);
}

And the broadcasting part

var ws = new WebSocket("ws://.....");
window.addEventListener("audioinput", function onAudioInput(evt) {
  if (ws) {
    ws.send(evt.data);
  }
}, false);

audioinput.start({
    bufferSize: 8192
});

score 0 · Answer 1 · answered Mar 12 '18 at 22:57

0

It doesn't look like you're dealing with compatible audio data formats. The code you linked to is for playing byte arrays, in which case your audio data should be a (much longer) string of integer numbers from 0 to 255.

What you've got is a fairly short (as audio data goes) string of floating point numbers. I can't tell what audio format that's supposed to be, but it would require a different player.

answered Mar 12 '18 at 22:57

kshetline

12,547
4
37
73

yes it's pretty long about 170kb per message I just truncated it for the post. – php_nub_qq Mar 12 '18 at 22:58
From the cordova plugin readme: `The audio format. Currently PCM_16BIT and PCM_8BIT are supported.` I guess I'm using the 16bit one – php_nub_qq Mar 12 '18 at 22:59
You could experiment with scaling those signed floating point numbers into the unsigned 0-255 range, find out what kind of god awful noise comes out when you push the data through. :) At least we know it's PCM data. What remains then is to find out the sampling rate and the range those floating point numbers are supposed to cover. – kshetline Mar 12 '18 at 23:06

Play raw audio with JavaScript

1 Answers1

Linked