posting a file loaded through fs.readFile() through axios+form-data

post-file.js

#!/usr/bin/env node
const axios = require('axios');
const FormData = require('form-data');
const fs = require('fs');

const filePath = __dirname + '/../accept-http-post-file/cookie.jpg';
fs.readFile(filePath, (err, imageData) => {
  if (err) {
    throw err;
  }
  const form = new FormData();
  form.append('file', imageData, {
    filepath: filePath,
    contentType: 'image/jpeg',
  });
  axios.post('http://localhost:3000/endpoint', form, {
    headers: form.getHeaders(),
  }).then(response => {
    console.log('success! ', response.status, response.statusText, response.headers, typeof response.data, Object.prototype.toString.apply(response.data));
  }).catch(err => {
    console.log(err);
  });
});

I am confused with this example, readFile returns a Buffer if encoding is not specified and FormData only accepts Blob or USVString. Am I missing something?

@lluisemper

readFile() and nodejs-style Buffer only exist in a nodejs environment. USVString and also Blob only exist in a browser environment. The form-data nodejs module is meant to look similar to the DOM (browser environment) class in usage. This is because the DOM API is something that people are familiar with. But it does not support and is not intended to be used in the browser environment. It is nodejs-oriented. See its documentation for FormData.append() for information on the types of arguments you may pass to the form-data npmjs module’s FormData class.

@guiathayde

Sorry for this super late and likely now useless response ;-). But, yes, if you need to support arbitrary file sizes, you are pretty much forced to use something like createReadStream() on the client and createWriteStream() on the server. Doing this and adding error handling and cleanup gets into a more complicated solution which I would spend time on if I needed to do it myself, but I don’t need to at the moment ;-). Sorry, and I hope that my earlier response was enough to get you somewhere!