Multer: Multer req.file.path "Cannot read property 'path' of undefined"

Created on 12 Feb 2018  路  6Comments  路  Source: expressjs/multer

I'm new to node.js and try to built a simple REST Api with file uploading capabilities. For file upload I'm using multer from npm and using POSTMAN for sending post request. But when I try to upload file with multer I got this error:

{
    "error": {
        "message": "Cannot read property 'path' of undefined"
    }
}

Here is my code for the API

_product.js_

import express from 'express';
import mongoose from 'mongoose';
import Product from '../models/product.model';
import multer from 'multer';
import multipart from 'connect-multiparty';

const router = express.Router();

const storage = multer.diskStorage({
    destination: (req, file, cb) => {
        cb(null, './uploads');
    },
    filename: (req, file, cb) => {
        cb(null, `${new Date().toISOString().replace(/:/g, '-')}${file.originalname}`);
    }
});

const fileFilter = (req, file, cb) => {
    // reject a file
    if(file.mimetype === 'image/jpeg' || file.mimetype === 'image/png') {
        cb(null, false);
    } else {
        cb(new Error('Only .jpeg or .png files are accepted'), true);   
    }
};

const upload = multer({
    storage: storage,
    limits: {
        fileSize: 1024 * 1024 * 5
    },
    fileFilter: fileFilter
});

router.post('/', upload.single('productImage'), (req, res, next) => {
    const product = new Product({
        _id: new mongoose.Types.ObjectId(),
        name: req.body.name,
        price: req.body.price,
        productImage: req.file.path
    });
    product.save().then(result => {
        console.log(result);
        res.status(201).json({
            message: 'Created product successfully',
            createdProduct: {
                name: result.name,
                price: result.price,
                _id: result._id,
                request: {
                    type: 'GET',
                    url: `http://localhost:3000/products/${result._id}`
                }
            }
        });
    }).catch(err => {
        console.log(err);
        res.status(500).json({
            error: err
        });
    });
});

_product.model.js_

import mongoose from 'mongoose';

const productSchema = mongoose.Schema({
    _id: mongoose.Schema.Types.ObjectId,
    name: {type: String, required: true},
    price: {type: Number, required: true},
    productImage: { type: String, required: false }
});

module.exports = mongoose.model('Product', productSchema);

Even I use connect-multipart middleware to fix the issue but then I got other error:

{
    "error": {
        "message": "stream ended unexpectedly"
    }
}

Here is the code when use multipart

router.post('/', upload.single('productImage'), multipart(), (req, res, next) => {
    const product = new Product({
        _id: new mongoose.Types.ObjectId(),
        name: req.body.name,
        price: req.body.price,
        productImage: req.file.path
    });
    product.save().then(result => {
        console.log(result);
        res.status(201).json({
            message: 'Created product successfully',
            createdProduct: {
                name: result.name,
                price: result.price,
                _id: result._id,
                request: {
                    type: 'GET',
                    url: `http://localhost:3000/products/${result._id}`
                }
            }
        });
    }).catch(err => {
        console.log(err);
        res.status(500).json({
            error: err
        });
    });
});

Now can anyone help me to fix this. It's really a big problem for me to go ahead without solving the issue....

Thanks in advance.

Most helpful comment

Hi, try setting your form enctype to multipart/form-data:
<form method="post" id="add-product-form" action="/admin/products/add-product" enctype="multipart/form-data">

All 6 comments

The error message is telling you that req.file is undefined. That means that multer doesn't think that it received a file.

How are you sending the file in Postman?

(also, I would recommend guarding against this with a if (!req.file) return res.send('Please upload a file'), that way your server won't crash if someone calls the API without giving a file.

Hi, try setting your form enctype to multipart/form-data:
<form method="post" id="add-product-form" action="/admin/products/add-product" enctype="multipart/form-data">

@LinusU thank you, i was looking for this for the whole day.

The only way of solve this issue is, if you're using postman then i recommend you to just uninstall your postman and re install it, then everything will work fine as before

just add to your html form enctype="multipart/form-data"

Was this page helpful?
0 / 5 - 0 ratings

Related issues

sant123 picture sant123  路  4Comments

BlueOctober picture BlueOctober  路  3Comments

samipjain picture samipjain  路  4Comments

nickretallack picture nickretallack  路  4Comments

NobleUplift picture NobleUplift  路  4Comments