CODEWITHSUNDEEP
jquerydjangoajaxblobpython-server-pages
Coder123
Coder123

Reputation: 21

How to POST a blob audio to Python Server using AJAX and jQuery?

I'm working on an audio web application that records the user's voice and then post as a .wav/.mp3 file to the server. I have some code to POST my audio blob in my .js file but I'm not sure if it is correct. I'm also not sure how to receive the blob audio and download it as a .wav file at the Python server side

Here's a snippet of my code in my app.js file

var formdata = new FormData();
formdata.append("audio", blob, "test.wav")

$.ajax(
{  
    type: 'POST',                  
    url: "http://localhost/pyserver.py",
    data: formdata,
    contentType: false,
    processData: false,
        
    success: function (data) {                       
        // data is what is sent back to you from the server, handle it here.
        console.log(data);
    },
    complete: function () {
        // let's say you have a "loading" window up, this is where you close it.
    },
    error: function (jqXHR, textStatus, errorThrown) {
        // handle error.
        console.log(errorThrown);
    }
});

Upvotes: 2

Views: 776

Answers (1)

Rony Macfly
Rony Macfly

Reputation: 422

js file

function sendAudio(blob)
{
    var wavFile = new File([ blob ], "audio.wav");      
    var form    = new FormData();
    form.append("myAudio", wavFile);
    
    $.ajax(
    {
        url: "/getAudio/",
        type: "POST",
        data: form,
        contentType: false,
        processData: false,
        success: function(getData)
        {
            console.log(getData);
        }
    });
}

views.py

def getAudio(request):
    if request.method == "POST":
        if request.FILES.get("myAudio", False):
            handleUploadFile(request.FILES["myAudio"])
    return HttpResponse()

def handleUploadFile(f):  
    with open("myFolder/" + f.name, "wb+") as destination:  
        for chunk in f.chunks():  
            destination.write(chunk)

handleUploadFile is better placed in a separate "function.py"

Upvotes: 1

Related Questions