使用节点上传后图像未显示在浏览器中答案

【问题标题】：Image not displayed in browser after being uploaded with node使用节点上传后图像未显示在浏览器中
【发布时间】：2021-12-02 20:09:13
【问题描述】：

我正在尝试使用 node-express 服务器上传一些图片，但我遇到了两个问题，一个是关于图片扩展的问题，另一个是关于正在显示的图片本身的问题。因此，在我上传文件后，该文件被添加到 upload 路径中，但类似这种自动生成的名称 2f22c2502b907f7bf0bc2567c43c801c 没有像 .png 这样的扩展名，即使我在浏览器中重命名文件如 2f22c2502b907f7bf0bc2567c43c801c.png 正在寻找喜欢默认的空图标浏览器而不是上传的图片。

我该如何解决这两个问题？

const express = require('express')
const multer  = require('multer')
const path = require('path')
const child_process = require("child_process");
const app = express();
const PORT = 3000;
const upload = multer({ dest: 'uploads/' })

  app.post('/upload', upload.single('picture'), function (req, res, next) {
    const FILE_OUTPUT = path.join(__dirname, `uploads/${req.file.path}`)

  child_process.execFile(
      "/usr/bin/convert",
      [path.join(__dirname, req.file.path), "-resize", "280x150", FILE_OUTPUT],
      function() {
        console.log('done resizing', FILE_OUTPUT)
        return res.send(`

                <img src="${FILE_OUTPUT}"/>
     
          `);
      }
    );
});

app.use('/', express.static(path.join(__dirname, 'public')));

app.listen(PORT, function () { console.log('Example app listening on port: ', PORT) })

【问题讨论】：

标签： javascript html node.js express ecmascript-6

【解决方案1】：

这应该是一项 multer 任务，因为 multer 不会附加文件扩展名，所以需要做的是在 multer 上进行一些设置。

查看此回复multer setup

【讨论】：