Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Sending audio data from JS to Python

I'm trying to send a .wav audio file (blob) från JS to Python using Flask. I simply want to save the file on the Python end and be able to play it on my computer. Here is my try:

JS:

fetch(serverUrl, {
  method: "post",
  body: blob
});

Where blob is of the type Blob {size: 5040, type: "audio/wav;"}

Python:

@app.route('/messages', methods = ['POST'])
def api_message():
      # Open file and write binary (blob) data
      f = open('./file.wav', 'wb')
      f.write(request.data)
      f.close()
      return "Binary message written!"

The file gets saved but only contains shitloads of [object BlobEvent]. What am I doing wrong and how can I fix it?

Edit: The audio samples are collected using MediaRecorder()

const mediaRecorder = new MediaRecorder(stream);
// Start
const chunks = [];
mediaRecorder.ondataavailable = e => {
    chunks.push(e);
}
// On stop
blob = new Blob(chunks, {'type': 'audio/wav;'});

I tried playing the audio again on the client side and it works just fine:

const audio = document.createElement('audio');
const audioURL = window.URL.createObjectURL(blob);
audio.src = audioURL;
like image 449
novalain Avatar asked Jun 29 '26 09:06

novalain


1 Answers

You are passing an array of event objects to the Blob constructor not the audio data.
The data is e.data, so your code should be

mediaRecorder.ondataavailable = e => {
    chunks.push(e.data);
}
like image 91
Musa Avatar answered Jul 01 '26 23:07

Musa



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!