如何在NodeJS中显示图像?

时间:2020-05-01 15:21:53

标签: node.js multer

能帮我显示上传的图片吗?对于上传,我正在使用multer。然后我需要在另一条路线中显示它。

因此,在文件夹“上载”中,每个新文件都位于头部。因此,我需要显示它。我该怎么办?

router.post('/upload', (request, response) => {
upload(request, response, (error) => {
    if(error) {
        request.flash('error_message', 'Only images are allowed')
        response.redirect('/')
    }
    else {
        if(request.file == undefined) {
            request.flash('error_message', 'Image file was not been selected.')
            response.redirect('/')

            console.log(request.file)
        }
        else {
            request.flash('success_message', 'Image was uploaded successfully.')
            response.redirect('/compress')

            console.log(request.file)
        }
    }
})

})

router.get('/compress', (request, response) => {
    response.render('compress', {
        //here i want to display it, but i didn’t succeed

    })
})

1 个答案:

答案 0 :(得分:0)

上传文件后:

  response.redirect(`/compress/${request.file.filename}`);

示例: /compress/my-image.png

您需要创建这样的路线:

 var fs = require('fs');  
 var path = require('path');

router.get('/compress/:filename', (request, response) => {

    let fileName = request.params.filename;

    // setup your path as per your project folder

    let pathToCheck= path.join(__dirname, '../../uploads/' +fileName);
    console.log('pathToCheck==',pathToCheck);

    // __dirname : will give you current directory path

    // checking if file exists or not 
    if (fs.existsSync(pathToCheck)) {
        // file found , display it 
        let imageUrl = `${request.protocol}://${request.headers.host}/uploads/${fileName}`;
        response.render('compress', { imageUrl : imageUrl });
    }else{
         // file not found , render error 404 page 
        response.render('error404');
    }

})