Strange error between two environments - FormData error with $ http POST (AngularJS - RoR)

Question

I am stuck in an inconsistent error when I try to send a FormData object to the server using the $ http method. The form is submitted when I start the rails server locally on MACOSX, but when I either click on the code for the step (ubuntu 14.04) or when my colleague (Xubuntu) tries to use 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 populated with 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 two queries:

• Unsuccessful request: Content-Type: text / plain; charset = utf-8
• Next: Content-Type: multipart / form-data li>

Update 2: I use XMLHttpRequest instead and it seems to fix the problem, at least for this particular form, I need to test it with the file attachment. So I assume that something is wrong with $ http or the way I use it.

Answer 1

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

Perhaps you have a missing file name somewhere that works fine on a Mac, but breaks on Linux.

Answer 2

You might want to force a content type for the 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 textual, then the receiving end will not be able to correctly analyze all form data. And if you leave it undefined, then the http stack will set the default value. By default, this value does not correspond to the OS.