Comments (22)
Need node.js version too
from axios.
maybe try form-data on the node side? like what node-fetch did.
from axios.
I made it work with FormData
.
// create the file object: https://developer.mozilla.org/en-US/docs/Web/API/File
const file = {
lastModifiedDate: ...,
lastModified: ...,
name: ...,
size: ...,
type: ...,
uri: 'file:///path/to/file.txt', // required value
};
// create FormData
const formData = new FormData();
formData.append('field_name', file);
// send with axios
axios.post('http://your/url/', formData);
(Works on Node and React Native)
from axios.
As mentioned above
I made it work with
FormData
.// create the file object: https://developer.mozilla.org/en-US/docs/Web/API/File const file = { lastModifiedDate: ..., lastModified: ..., name: ..., size: ..., type: ..., uri: 'file:///path/to/file.txt', // required value }; // create FormData const formData = new FormData(); formData.append('field_name', file); // send with axios axios.post('http://your/url/', formData);(Works on Node and React Native)
It take some time to understand how to create file object, and I finally made it work:
const file = new File(
[fs.readFileSync(YOUR_FILE_PATH)],
fileName,
{ type: `image/${fileType}` } // what I upload is image.
);
Thanks @douglasjunior
from axios.
π
from axios.
I'd like to see window.fetch style api for uploads https://github.com/github/fetch#file-upload
from axios.
@epeli this is what I had in mind as well. Only difference is that it would be data
instead of body
since axios is already using data
as the post body property.
from axios.
This would be a fantastic feature. Since there is a polyfill already for fetch would it be a matter of adding a mapping for the property difference?
from axios.
After #22 file uploads using FormData should work just fine. There's an usage example in the PR.
from axios.
@nnarhinen Thanks. I'll give it a shot.
from axios.
@nnarhinen @jimthedev #22 takes care of XHR file upload, but still need to handle file upload for node.js
from axios.
@mzabriskie oh yes, that is true
from axios.
really looking forward to the support for uploading file in node.js. any updates?
from axios.
Just a status update. I've looked into supporting file uploads with node.js. While it's not technically challenging, I'm trying to come up with a consistent API between node.js and the browser. While the browser uses FormData
, node.js uses a Stream
. For axios to be truly isomorphic it should allow using the same code in both environments.
from axios.
Makes sense. It doesn't seem like there is any single standards-based or deprecated-standards based API for this, but there is flow.js (a fork of resumeablejs) which might provide at least a proven, successful API as a model. Although it looks primarily browser based, they seem to have a Node example although there is an ambiguous open issue about it.
from axios.
hey...i'm a little confused. is it possible to upload a file from node using axios+streams ?
from axios.
π It's good to hear that file uploading will be implemented soon. Thanks for your efforts!
from axios.
I copied this example, and it's working for me.
https://github.com/mzabriskie/axios/blob/master/examples/upload/index.html
from axios.
@donaldparker this only work for browser. Do you know how to make it on node.js?
from axios.
Hi, I'm trying to upload a file from it's filename instead of uploading it as form-data using Electron.
I tried both the node.js solution & browser solution but both don't really workout as I get [object Object] as the file request on the server.
This is a sample code of what I'm doing ...
Getting the file from it's fileName Url.
export function generateContract(url, customer) {
const data = new FormData()
const file = fs.createReadStream(url)
data.append('names', customer.names)
data.append('email', customer.email)
data.append('contract', file)
const headers = data.getHeaders()
return {data, headers}
}
Sending the returned formData using axios.
export function sendEmail({data, headers}) {
return checkConnetion()
.then(() => {
return axios.post(emailUrl, data, {headers})
})
.catch(() => {
return axios.post(emailUrlOffline, data, {headers})
})
}
I also made this question on stackoverflow if someone can take a look.
EDIT
I wasn't placing form.getHeaders()
in headers field on my post requests.
Now I'm doing it and I'm getting this error on the server instead.
Error: MultipartParser.end(): stream ended unexpectedly: state = START_BOUNDARY
at MultipartParser.end (/home/user/Projects/Electron/Mijengo/server/node_modules/formidable/lib/multipart_parser.js:326:12)
at IncomingMessage.<anonymous> (/home/user/Projects/Electron/Mijengo/server/node_modules/formidable/lib/incoming_form.js:130:30)
at emitNone (events.js:105:13)
at IncomingMessage.emit (events.js:207:7)
at endReadableNT (_stream_readable.js:1059:12)
at _combinedTickCallback (internal/process/next_tick.js:138:11)
at process._tickCallback (internal/process/next_tick.js:180:9)
Thanks.
from axios.
This was closed after having the in progress tag removed. Has an alternative been found?
from axios.
@euroclydon37 I couldn't solve my issue.
So I ended up using superagent for just one request! I had deadlines to meet so I gave the evil smile & went for it.
I will be glad to hear a solution, will update my program if I can test and make it work.
from axios.
Related Issues (20)
- Cannot see the Axios result in the then, catch, and finally methods.
- CSRF Token Mismatch HOT 4
- [fatal][nodejs] βError: Unexpected end of formβ after multiple post file formdata, and then hang up after multiple error happening HOT 3
- "Class extends value #<newConstructor> is not a constructor or null" when sending request from node.js 20.12.0
- [0.28.1] options.paramsSerializer as function don't work HOT 2
- vite5+vue3+ts Sending request error SyntaxError: The requested module '/node_modules/.vite/deps/axios.js?v=bc297318' does not provide an export named 'AxiosInstance' HOT 1
- Issue CVEs for vulnerabilities fixed by #6167 and #6163 HOT 1
- How to set localAddress when sending HTTP requests? HOT 2
- API call happening twice, but called once! HOT 3
- RefferenceError: Axios is not defined. HOT 2
- Security vulnerability HOT 2
- postForm's form-data serialization breaks for Blob in Node.js
- Axios stream aborts early during 204 response from prism cli.
- I am getting a error involving CancelToken.js...
- TypeError: Converting circular structure to JSON
- React native Android NETWORK ERROR HOT 1
- Issue with downloading files larger than a few mbs on Chrome specifically HOT 4
- please expose the formDataToStream for public use
- 100% Upload progress on dev mode only.
- XSRF-TOKEN logic should utilize cookie domain instead of current page domain HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from axios.