Join the Stack Overflow Community
Stack Overflow is a community of 6.3 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I am developing a web app using angular, python and Flask. In my app there is a form where the user need to enter some data and to upload his photo. I want to implement the file upload to the server using angular. I saw that I need to use the FormData() and to bind the data from the HTML to angular using "watch". The javascript part is clear. I don't understand how can I get the data from the Python side.

This is my HTML -

<form  enctype="multipart/form-data" ng-submit="submitGuideDetailsForm()">
  <div class="form-group">
    <label for="usr">Add your photo:</label>
    <input type='file' class="form-control" name='file' onchange="angular.element(this).scope().uploadFile(this.files)">
  </div>
</form>

This is my angular -

 $scope.uploadFile = function(files) {
            $scope.file = new FormData();
            $scope.file.append("file", files[0]);
        };
 $scope.submitGuideDetailsForm= function() {
     $http.post('/uploadFile', $scope.file, {
           headers: {'Content-Type': undefined },
           transformRequest: angular.identity
          }).success(function(results) 
           {   
              $log.log('success load file')
           }).error(function(error) 
           {
              $log.log('error load file!!!!!')
              $log.log(error);
           });
       };

I want to get the file on the server side, using python and flask -

@app.route('/uploadFile', methods=['POST'])
def uploadFile():
  json_data = request.json
  print(json_data)
  status = 'success'
  return jsonify({'result': status})

I don't know how to get the data from the 'request' object. request.json does not work.

Please advice me what am I doing wrong. How can I get the data from the 'request' object? Do I need to encode the data to a file? How do I send the data back to client? Do I need to encode it back? I did not find a full example using angular and python/flask uploading a file to server, saving it and than downloading it to the client. Thanks a lot, Dina

share|improve this question
    
try request.file or request.files – reptilicus Apr 15 at 22:22

The command 'request.files' work The gets me the following object -

ImmutableMultiDict([('file', <FileStorage:
 u'12132638_10153196350425732_1151540092606190338_o.jpg'
 ('image/jpeg')>)])

I don't understand how can I save it on the server. How do I get only the file name out of this object And how do I send it back to the client side?

Thanks a lot, Dina

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.