我在后端使用feathers.js，在前端使用React，我需要实现一种上传图片的方法。我正在使用multer来处理上传(我也尝试过使用busboy)，但我似乎无法上传实际的图片，或者至少无法在req.file上访问它。
在客户端，我有：
<form method="post" enctype="multipart/form-data" action="/picture/upload">
<input type="file" name="avatar" />
<input type="submit" value="Submit" />
</form>
在/src/middleware/index.js中，我有：
'use strict';
const uploadPicture = require('./uploadPicture');
const handler = require('feathers-errors/handler');
const notFound = require('./not-found-handler');
const logger = require('./logger');
var multer = require('multer');
const upload = multer({ dest: '../../client/img'});
module.exports = function() {
// Add your custom middleware here. Remember, that
// just like Express the order matters, so error
// handling middleware should go last.
const app = this;
app.post('/picture/upload', upload.single('avatar'), uploadPicture(app));
app.use(notFound());
app.use(logger(app));
app.use(handler());
};
这是src/middleware/uploadPicture.js:
'use strict';
module.exports = function(app) {
return function(req, res, next) {
console.log('req.file', req.file);
console.log('req.body', req.body);
};
};
req.file总是未定义的，并且req.body确实包含我上传的图像的名称。
我曾尝试在一个基本的Express项目中使用mutler和busboy进行测试，它运行得很好，这让我认为它可能与feathers.js使用的中间件有关，可能它更改了一些头之类的东西，所以multer无法将文件附加到请求对象。
这是在src/app.js中定义中间件的顺序，也是运行服务器实例的位置：
app.use(compress())
.options('*', cors())
.use(cors())
.use('/', serveStatic( app.get('client') ))
.use(bodyParser.json())
.use(bodyParser.urlencoded({ extended: true }))
.configure(hooks())
.configure(rest())
.configure(services)
.configure(middleware);
关于如何在这种情况下处理图像上传，有什么想法吗？
我使用的是react，所以enctype不是一个受支持的HTML属性。我应该在表格中使用encType。这解决了问题。