Sending a blob image via ajax using django

After a video is processed, I'm passed an instance of a Javascript "Blob" object, which contains the preview image (In JPEG format). I want to send the image via an ajax POST to the backend on django and am having trouble doing so.

I tried to encode to base64 in javascript, and then decode it in python and create the image again, but the image file can't be opened; it's either damaged or corrupt. I included the code that I wrote below: Django:

def thumbnail_photo(request):
    if request.POST:
        data = request.POST.get('thumbnail')        
        convert = base64.b64decode(data)
        image_result = open('thumbnail.jpeg', 'wb')
        image_result.write(convert)

Javascript:

onPreviewAvailable: function(previewImageBlob) {
          blob = previewImageBlob;
var reader = new window.FileReader();
          reader.readAsDataURL(blob);
          reader.onloadend = function() {
              base64data = reader.result;
              base64 = base64data;
              base64 = window.btoa(base64);
    data = {'thumbnail': base64};
        $.ajax({
           url: 'thumbnail_photo',
            type: 'POST',
            data: data,
            dataType:'json',
            success: function (data) {
            }

        });
}); 
}

I also tried the following:

blob = previewImageBlob;
var oReq = new XMLHttpRequest();
oReq.open("POST", thumbnail_photo, true);
oReq.onload = function (
}; 
oReq.send(blob);

However, the value either came as empty or I would get an error saying that the file couldn't be sent.

I also tried appending the blob to form data:

          var formData = new FormData();
     formData.append('file', blob);

     $.ajax({
       url: 'thumbnail_photo',
       type: 'POST',
       data: formData,
       cache: false,
       contentType: false,
       processData: false,
       success: function(response) {
           console.log('works');
         $('#result').text(response);
       }
     });

Any help is appreciated!!