Comment rendre des images qui sont stockées en utilisant multer dans l'application express?

Question

J'ai stocké des images avec multer sur le serveur d'application express. Mais je ne reçois pas ces images à utiliser dans mes fichiers html.

Code pour télécharger le fichier.

var multer = require("multer") 

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, __dirname+'/public/uploads') 
    }, 
    filename: function (req, file, cb) { 
    cb(null, Date.now()+file.originalname) 
    } 
}) 
app.post('/add/details', upload.any(), function(req,res){ 
    var data = req.body; 
    data.propic = req.files[0].path; 
    res.render('index',{ 
    "data": data 
    }); 
}) 

Dans le fichier d'index, je suis en train de img src à data.propic mais pas montrer l'image.

Answer 1

vous pouvez utiliser cette

var fileUpload = require('express-fileupload'); 
router.use(fileUpload()); 

sampleFile = req.files.team_image; 
file_name = sampleFile.name; 
sampleFile.mv('public/storage/'+file_name, function(err) { 
       if (err) { 
        if (err) throw err; 
       } 
}); 

Answer 2

Puisque vous enregistrez les images dans le dossier public/images, vous pouvez profiter de express.static pour servir ces nouveaux fichiers téléchargés automatiquement.

var express = require('express'); 
var multer = require("multer") 

var app = express(); 

//all static contents inside the given folder will be accessible 
//e.g. http://example.com/public/uploads/test.png 
app.use(express.static(__dirname+'/public/uploads')); 

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, __dirname+'/public/uploads') 
    }, 
    filename: function (req, file, cb) { 
    cb(null, Date.now()+file.originalname) 
    } 
}); 

app.post('/add/details', upload.any(), function(req,res){ 
    var data = req.body; 
    // path of uploaded file. 
    data.propic = '/public/uploads/'+req.files[0].filename; 
    res.render('index',{ 
     "data": data 
    }); 
}); 

Supposons que vous utilisez jade comme moteur d'affichage, vous pouvez intégrer img comme suit:

img(src=data.propic) // it's equivalent to http://example.com/public/uploads/test.png