AngularJs Ajax POST form with file upload

I was having trouble implementing file upload with angular + laravel. Every time I tried sending the multipart form, the server wouldn't receive the form data, even tho it was clearly being sent, or so I thought. I finally found THIS article that solved all my problems.

Long story short, this is the $http call:

var data = new FormData();

data.append("file", file);

$http.post("//myDomain.com/api/demo", data, {
    headers: { 'Content-Type': undefined },
    transformRequest: angular.identity
}).success(function (data, status, headers, config) {

}).error(function (data, status, headers, config) {

});

The other answer by rolin.tencent.Shenzhen also mentioned setting Content-Type as undefined to let the browser sort it out.


I faced a similar problem.

The solution is to use formData

var formData = new FormData();
formData.append("file", $scope.file);

and replace

data: {
    file: $scope.file
}

with

data: {
    formdata
}