Uploading error req.file is undefined and path is also undefined somehow multer is not populating req obj

In route:

var multer = require('multer');
var storage = multer.diskStorage({
  filename: function(req, file, callback) {
    callback(null, Date.now() + file.originalname);
var imageFilter = function (req, file, cb) {
    // accept image files only
    if (!file.originalname.match(/\.(jpg|jpeg|png|gif)$/i)) {
        return cb(new Error('Only image files are allowed!'), false);
    cb(null, true);
var upload = multer({ storage: storage, fileFilter: imageFilter})

var cloudinary = require('cloudinary');
  cloud_name: '', 
  api_key: '', 
  api_secret: ''

app.post('/selleraddproduct/:id', upload.single('image'), (req, res) => {
    cloudinary.v2.uploader.upload(req.file.path, function(result) {
        // add cloudinary url for the image to the campground object under image property
        req.body.productdata.picture = result.secure_url;

In Front End:

 onChangeimage = (event) => {
            picture: event.target.files[0]
<div className="form-group">
            <label htmlFor="inputpicture3" className="col-sm-2 control-label">upload Image</label>
            <div className="col-sm-8">
            <input type="file"  id="inputpicture3"  onChange={this.onChangeimage} accept="image/*" placeholder="Image"/>

Your input has no name attribute. How is the code supposed to find it?


I tried that also it’s not problem with the name it’s problem with the implementation of form data and then sending through it as key value pair.

I got the solution, Thanks for the reply.

It’ll be a problem with both then, because that code has no way to identify what “image” is. But i’m glad you got your solution.

Yeah it will be a big problem I have spend most of my time thinking of it.