Flask Request.files Returns ImmutableMultiDict([])

I have tried a million times to get this working. I am making a web app and I have a button (modal) that pops up where the user enters the name and uploads a file. When the user c

Solution 1:

Would you mind elaborating on the issue a bit more? It's expected that Flask Request returns an ImmutableMultiDict:

MultiDict object containing all uploaded files. Each key in files is the name from the <input type="file" name="">. Each value in files is a Werkzeug FileStorage object.

It basically behaves like a standard file object you know from Python, with the difference that it also has a save() function that can store the file on the filesystem.

Note that files will only contain data if the request method was POST, PUT or PATCH and the <form> that posted to the request had enctype="multipart/form-data". It will be empty otherwise.

See the MultiDict / FileStorage documentation for more details about the used data structure.

http://flask.pocoo.org/docs/1.0/api/#flask.Request.files

Solution 2:

I believe the problem is with your serialisation of the form. - Try giving this a read.

You can also use something similar to the below:

(function($) {
  $.fn.serializeFiles = function() {
    var form = $(this),
        formData = new FormData(),
        formParams = form.serializeArray();

    $.each(form.find('input[type="file"]'), function(i, tag) {
      $.each($(tag)[0].files, function(i, file) {
        formData.append(tag.name, file);
      });
    });

    $.each(formParams, function(i, val) {
      formData.append(val.name, val.value);
    });

    return formData;
  };
})(jQuery);

You can eliminate which part is not working by not preventing the form to submit, and see if by default; the form submits files' to the backend. - It's highly unlikely that you're passing the correct data from the way you're serialising the form.