如何使用multer显示上传的图片?

时间:2018-07-11 08:27:59

标签: node.js file-upload

我将nodejs用作后端,将vuejs用作前端。我已经使用邮递员将一些文件作为测试上传到我的后端,但是,如何使用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');
});

我的api公用文件夹中有一个名为“ logo-1531296527722”的图像。如果尝试在img src(http://localhost:3000/api/company/public/logo-1531296527722)中使用它,则不会显示。如果尝试访问此路由,则会出现此错误Cannot GET /api/company/public/logo-1531296527722。在所有与此有关的问题中,nodejs都有自己的html处理器,例如ejs或jade,但我的情况是,nodejs只是在为我服务,所有图像都必须使用vuejs渲染。

2 个答案:

答案 0 :(得分:1)

我把它弄干净了! 在我的app.js中,我包含了app.use('/dist', express.static(path.join(__dirname + '/dist')));

答案 1 :(得分:0)

我有同样的问题。更改您的代码

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

对此:

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

这应该可以完成工作:)