如何使用multer显示上传的图像？

Question

I'm using nodejs as backend and vuejs as front. I've uploaded somes files as test using postman to my backend, but, how could I display these uploaded files using multer?

const multer = require('multer');


const storage = multer.diskStorage({
    destination: function (req, file, cb) {
        cb(null, 'public/')
    },
    filename: function (req, file, cb) {
        cb(null, file.fieldname + '-' + Date.now())
    }
})

const upload = multer({ storage: storage }).single('logo');

router.post('/logo', auth.authorize, (req, res, next) => {
    upload(req, res, (err) => {
    });
    res.status(200).send('uploaded');
});

I got an image named 'logo-1531296527722' in my api public folder. If I try to use it in my img src ( http://localhost:3000/api/company/public/logo-1531296527722 ) it doesn't displayed. If I try to access this route I got this error Cannot GET /api/company/public/logo-1531296527722 . In all questions about that, nodejs has its own html processor like ejs or jade, but I my case, nodejs is just serving my front and all images must be rendered using vuejs.

Answer 1

I dit it! In my app.js I include app.use('/dist', express.static(path.join(__dirname + '/dist')));

Answer 2

I had the same problem. Change your code from

filename: function (req, file, cb) {
        cb(null, file.fieldname + '-' + Date.now())
}

to this:

filename: function (req, file, cb) {
        cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname))
    }

This should do the work :)