Weird error between 2 environments - FormData bug with $http POST (AngularJS - RoR)

问题

I am stuck with an inconsistent bug when I try to submit a FormData object to the server via the $http method. The form is sent when I am running the rails server locally on MACOSX but when I either push the code to staging (ubuntu 14.04) or when my coworker (Xubuntu) tries it, the payload object is empty ({}). Here is my setup:

 return $http.post(url, parsed.form, self.$headers).then(function(res){
    self.$parseResponse(res.data, parsed.attrs);
    return self;
 });

where parsed.form is a FormData object filled with a nested json and file attachments and

self.$headers = { headers:
   { 
     'Content-Type': undefined,
     'Accept': 'application/json',
     'Content-Transfer-Encoding': 'utf-8',
      transformRequest: angular.identity 
    }

};

Bower packages installed:

{
  "angular": "1.2.28",
  "angular-route": "1.2.28",
  "angular-resource": "1.2.28",
  "angular-bootstrap": "0.12.0",
  "angular-activerecord": "latest",
  "angular-devise": "latest",
  "angular-mocks": "1.2.28",
  "lodash": "latest"
}

Let me know if you need more information.

Update:

I noticed a difference in the headers between the 2 requests:

The failing request: Content-Type:text/plain;charset=UTF-8
The succeeding one: Content-Type:multipart/form-data

Update 2: I am using XMLHttpRequest now instead and it seems to have fixed the problem, at least for this particular form, I need to test it with a file attachment. So I am guessing there is something wrong with $http or the way I am using it.

回答1:

Not sure, but the only issues I've seen between Mac + Linux environments are that Mac filenames are case insensitive whereas on linux they are case sensitive.

Its possible you have a miss-cased filename somewhere that is working fine on Mac but breaks on Linux.

回答2:

You may want to force the content-type to form-data:

self.$headers = { headers:
   { 
     'Content-Type': 'Content-Type:multipart/form-data',
     'Accept': 'application/json',
     'Content-Transfer-Encoding': 'utf-8',
      transformRequest: angular.identity 
    }

};

If the content-type is text-plain, the recieving end would not be able to parse correctly all the form data. And if you leave it undefined, the http stack is going to set a default. This default is inconsistent between OS, as it seems.

来源：https://stackoverflow.com/questions/29173102/weird-error-between-2-environments-formdata-bug-with-http-post-angularjs-r

标签

angularjs

form-data