axios: Cannot upload file within FormData

Seems like there is a problem in isFormData function:

I am using axios in react-native project where:

const form = new FormData();
toString.call(form) === '[object Object]'; // true for React-Native
toString.call(form) === '[object FormData]'; // true for Browser
(form instanceof FormData) // true for both platforms

Why are these kind of useless “optimizations” even done? Why change something that works? Nobody will see any speed improvement.

still issue use 0.26.1

This issue appeared after this change: https://github.com/axios/axios/pull/3342/files#diff-5dfe38baf287dcf756a17c2dd63483781b53bf4b669e10efdd01e74bcd8e780aR57

As was said above, it is because Object.prototype.toString.call(data) returns [object Object] rather than [object FormData], at least in React Native (data being declared with const data = new FormData();). Seems to be related to an older issue in form-data: https://github.com/form-data/form-data/issues/396

I managed to fix it without downgrading by adding this to the beginning of the index file in the app:

import FormData from 'form-data';

FormData.prototype[Symbol.toStringTag] = 'FormData';

2 days have passed…

Closed I will be releasing the fix tonight

This works perfectly well in Axios 0.24.0, so no excuse to not fix the bug. The solution definitely cannot be to include some additional dependency and add parameters to post call.

Same issue with "axios": "^0.26.1"

Please upgrade to 0.27.2

@RopoMen

I don’t think you read manual carefully. As mention in readme: In node.js, you can use the [form-data](https://github.com/form-data/form-data) library as follows: Unfortunately I am not using axios on node backend, but on mobile client I have only react-native.

Also why do I need form-data if only axios should be enough? I do not like to put everything what is available on the web and use only one “thing” from those heap as you probably do. PS I am using formidable on node backend server as stated in the issue description.

So I assume your suggestion is wrong.

@Romick2005

Your code

axios({
    method: "post",
    url: [serverUrl],
    data: formData, // FormData object instance with uploading file field
    timeout: 120000,
    headers: {"Content-Type": "multipart/form-data"},
});

Is not done as it is documented. From Axios Readme https://github.com/axios/axios axios.post('https://example.com', form.getBuffer(), { headers: form.getHeaders() })

And here is the implementation of form-data getHeaders() function https://github.com/form-data/form-data/blob/53adbd81e9bde27007b28083068f2fc8272614dc/lib/form_data.js#L294-L307

It is also setting the boundary

var formHeaders = {
    'content-type': 'multipart/form-data; boundary=' + this.getBoundary()
  };

I suggest first fixing the form-data usage to use form.getHeaders() and if issue still persists then post details over here.

FormData file upload is working in 0.27.2 and 0.22.0.

https://github.com/axios/axios/issues/4406#issuecomment-1039433920 <-- this comment worked for me on both 0.25 and 0.26

using 0.26 and still not working. 12 days have passed… mlazari tks for the workaround