简体   繁体   中英

react / expressjs / multer don't save image

i send a file from "react dropzone component" to "node server" and try to upload this with "multer" but no show any error, the file no upload and req.file/s is undefined

 var express = require('express'); var router = express.Router(); var msg = require('../helpers/MessageHandler'); var CM = require('../helpers/ContentMessages.json'); var storage = multer.diskStorage({ destination: function(req, file, cb) { cb(null, 'public/uploads/'); }, filename: function(req, file, cb) { cb(null, Date.now() + file.originalname); } }); var upload = multer({storage: storage}).any(); var path = '/enterprise'; router.post(path, function(req, res, next) { var enterprise = req.body.obj; console.log(req.body); console.log(req.files); console.log(req.file); upload(req, res, function(err) { if(err) { return res.status(500).json(msg.prototype.errorMsg(err)); } else { return res.status(200).json(msg.prototype.success(CM.message.success.doc_create, null)); } }); }); 

the react component is somthing like this , in the fetch function i send a object with all the fields

 insertObj (values) { console.info(values); const obj = JSON.stringify({obj: values}); let url = '/api/v1/enterprise'; const headers = { 'Content-Type': 'application/json', 'Access-Control-Request-Method': '*'}; const req = new Request(url, {method: 'POST', headers: headers, body: obj}); fetch(req) .then((response) => { return response.json(); }) .then((enterprise) => { console.log(enterprise); }).catch((error) => { console.log(error); }); } 

inside multer req.files will be visible. So change your code to this:

upload(req, res, function(err) {
 var enterprise = req.body.obj;
    console.log(req.body);
console.log(req.files);
console.log(req.file); 
    if(err) {
         return res.status(500).json(msg.prototype.errorMsg(err));
    } else {
        return     res.status(200).json(msg.prototype.success(CM.message.success.doc_create, null));
    }
});

Also instead of 'Content-Type': 'application/json' there should be enctype='multipart/form-data'.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM