node.js - 使用 vue.js、node.js 和express.js 上传原始文件

Question

请告诉我如何使用bodyparser.raw()将文件上传到express.js服务器

• 客户端

<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://stackoverflow.com/a/40411508/9018487和: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");
});