0

I want to simply record audio and send the file to my controller. I'm using https://addpipe.com/simple-recorderjs-demo/ to record my audio, and this is working just fine. But when i want to actually send my to anything in my Symfony 4 project, it never receives anything. So i figured i manually remake a form with the audio blob inserted, but does not work out either.

Any ideas how to make this happen? Any leads in the correct direction would be great!

I've tried simply inserting the audio file into a existing form, but because of security reasons this is not allowed anymore.

    var formElement = document.querySelector("form");
    var formData = new FormData(formElement);
    var request = new XMLHttpRequest();
    request.open("POST", "http://127.0.0.1/index.php/processaudio");
    formData.set("form_file", blob, 'file');
    request.send(formData);
Inform-all
  • 123
  • 9

1 Answers1

1

Try this:

var formElement = document.querySelector("form");
var formData = new FormData(formElement);
var request = new XMLHttpRequest();
request.open("POST", "http://127.0.0.1/index.php/processaudio");
var fileSelect = document.getElementById("fileSelect");
if(fileSelect.files && fileSelect.files.length == 1){
    var file = fileSelect.files[0]
    formData.set("file", file , file.name);
    request.send(formData);
}

fileSelect is id of input file

see: https://dev.to/imben1109/html-form-ajax-file-upload-front-end-2klc

or if you want to use jquery

How to use FormData for ajax file upload

Manzolo
  • 1,772
  • 10
  • 13
  • Thank you! Worked as a charm. All i had to add was to convert my blob into a file like this: var newfile = new File([blob], "file"); – Inform-all Aug 27 '19 at 11:33