javascript - 如何配置 API 端点以从 ember-uploader 组件接收文件

Question

我正在尝试弄清楚如何使用 ember-uploader ，我有以下组件(如 README 中的组件)

export default EmberUploader.FileField.extend({
  filesDidChange: function(files) {
    const uploader = EmberUploader.Uploader.create({
      url: (ENV.APP.API_HOST || '') + '/api/v1/images/',
    });
    console.log(uploader);

    if (!Ember.isEmpty(files)) {
      var photo = files[0];
      console.log(photo);

      uploader.upload(photo)
        .then(data => {
          // Handle success
          console.log("Success uploading file");
          console.log(data);
        }, error => {
          // Handle failure
          console.log("ERROR uploading file");
          console.log(error);
        });
    }
  }
});

express API 端点正在监听 POST 请求。

var saveImage = (req, res, next) => {
    let body = req.body;
    res.json({
      data: body
    });
};

但是请求完成后body为空。我真的不知道如何实现 API 端点来获取文件，我尝试查看 req 对象，但它不包含该文件。

调试它，使用组件选择文件后，我在控制台中得到以下信息。

API 端点似乎可以工作，因为我得到以下输出:

POST /api/v1/images/ 200 27.284 ms - 11

但我无法获取该文件。

Answer 1

解决方案

In Express 4, req.files is no longer available on the req object by default. To access uploaded files on the req.files object, use a multipart-handling middleware like busboy, multer, formidable, multiparty, connect-multiparty, or pez.

关注此blog ，以下代码已添加到 API 中，问题中发布的 ember-uploader 代码按预期工作。

import formidable from 'formidable';

var saveImage = (req, res, next) => {
    var form = new formidable.IncomingForm();
    form.parse(req);

    form.on('fileBegin', function (name, file){
        file.path = __dirname + '/tmp/' + file.name;
    });

    form.on('file', function (name, file){
        res.json({
            data: file.name
        });           
    });
};