Загрузите необработанный файл с vue. js, node.js и express. js

Question

Скажите, пожалуйста, как я могу загрузить файл на express. js сервер, использующий сервер bodyparser.raw()

• на стороне клиента

<input type='file' @change='onFilePicked' />

// ...
onFilePicked(file) {
  const url = 'upload/api/url';
  let fd = new FormData();
  fd.append('upload', file);
  fd.append('key', 'somestring');
  axios.post(url,fd).then( res => { console.log(res); }, err => { console.log(err); });
}
// ...

• на стороне сервера

const app = express();
app.use(bodyParser.raw());

app.post('upload/api/url', (res, req) => {
  console.log(req.req.key); //undefined
  console.log(req.req.upload); //undefined

  res.res.status(500).send("WIP");
});

Я должен использовать bodyparser.raw(). Может быть, я могу указать form data как значение в json объекте?

Я не могу прочитать содержимое файла внутри app.post('upload/api/url', ... );.

Answer 1

Посмотрите на: { ссылка } и: https://www.npmjs.com/package/multer

• на стороне клиента

// ...
onFilePicked(file) {
  const url = 'upload/api/url';
  let fd = new FormData();
  fd.append('upload', file);
  fd.append('key', 'somestring');
  axios.post(url,fd, {
    headers: {
      ...
      'Content-Type':'multipart/form-data'
    }
  })
  .then( res => { console.log(res); }, err => {console.log(err); });
}
// ...

• на стороне сервера

const multer = require("multer");
const upload = multer({dest: "/data/"});

const app = express();
app.use(bodyParser.raw());

app.post('upload/api/url', multer.single('upload'), (res, req) => {
  console.log(req.req.file);
/*
{
  fieldname: 'upload',
  originalname: 'somefile.txt',
  encoding: '7bit',
  mimetype: 'text/plain',
  destination: 'tmp/',
  filename: '564968d9611fa809e4b32233854f12aa',
  path: 'data/564968d9611fa809e4b32233854f12aa',
  size: 93038
}
*/

  // TODO:
  // 1. Open and read file req.req.file.path to local variable
  // 2. Remove file req.req.file.path
  // 3. Do something with data from file

  res.res.status(500).send("WIP");
});