Request.files object is empty on flask server when uploaded using ng-file-upload

Question

I am using ng-file-upload to upload a xls or xlsx file, below is my html code

<div ngf-drop ngf-select ngf-change="checkFile($invalidFiles);" ngf-model-invalid="invalidFiles" ng-model="file" class="center" ngf-drag-over-class="'dragover'" ngf-pattern="'.xls,.xlsx'">

<button class="some-class" ng-click="upload(file)"></button>

Angular controller:

$scope.upload = function (file) {
    if (file) {
            var upload = Upload.upload({
                url: API.url('upload'),
                data: {
                  file: file
                },
                headers:{ // tried passing different headers as well 
                    "Content-Type":"multipart/form-data"
                 }

            });
            upload.then(function (resp) {
                //Some Operation
            }, null, function (evt) {
                //Some Operation
            });
    }
};

Flask server:

    def upload(self):
        params = self.get_params(request)
        file = request.files['file'] ###This object is empty.
        result = self._upload_file(file)
        return "Dummy"

I followed this documentation for server side. I think the problem is from client side, may be I am sending some bad request as flask server is throwing 400. So I have tried by sending 'multipart/form-data' headers but no luck and also by sending Form data explicitly. I have also looked for few solutions like sol-1. I didn't find anything which could solve my problem in the ng-file-upload doc as well.

If required I can send the request headers as well.

I might be missing very tiny part, can someone please point me out that.

Answer 1

There is default value for headers which is already in post request. Adding "Content-Type":"multipart/form-data" is just overriding that. Try it without that.