node.js - 无法在 Node js中显示静态文件夹中的图像

Question

Node.js 新手，尝试使用静态文件夹显示图像

http://localhost:3000/uploads/animal.jpg

但当我 checkin uploads 文件夹时，我无法显示它并收到错误 Cannot GET/uploads/C6MGiE-1528523813517.jpg 。图片已成功上传。图片正在通过 Postman

上传

app.ts

import cors from "cors";
import express from "express";
import mongoose from "mongoose";
import path from "path";
import mediaUploadRoute from "./routes/media-upload.route";

app.use('/api/uploads', mediaUploadRoute);

const app = express();
app.use(express.json());
app.use(cors());

const directory: string = path.join(__dirname, '/uploads/')
app.use(express.static(directory))

media-upload.route.ts

import express from "express";

// mediaFiles is a service that uses multer to host the images to the server
import mediaFiles from "../services/media-files";

const router = express.Router();

router.post('/fileInput_icon', mediaFiles.uploadSingle('fileInput_icon'), (req, res) => {
    let file = req.file;
    file.path = file.path.replace(/\\/g, "/")
    res.status(200).send(JSON.stringify(file.path));
})

router.post('/fileInput_image', mediaFiles.uploadSingle('fileInput_image'), (req, res) => {
    let file = req.file;
    file.path = file.path.replace(/\\/g, "/")
    res.status(200).send(JSON.stringify(file.path));
})

export default router;

原因是什么？我已经工作了很多天但没有成功

更新

app.js

// it created public folder in the root of project directory
app.use(express.static('/public'));

在multer

private storage = multer.diskStorage({
        destination: 'public',
        filename: function (req, file, callback) {
            callback(
                null,
                file.originalname.replace(/\.[^/.]+$/, "") + '-' + Date.now() + path.extname(file.originalname))
        }
    })

尝试通过以下方式访问

http://localhost:3000/C6MGiE-1528530542730.jpg

http://localhost:3000/public/C6MGiE-1528530542730.jpg

但一切都是徒劳的:(

Postman 获取响应“public/C6MGiE-1528530542730.jpg”

Answer 1

问题在于这段代码:

const directory: string = path.join(__dirname, '/uploads/')
app.use(express.static(directory))

查找正确的目录，但未设置正确的路径。因此，当您请求 /uploads/C6MGiE-1528523813517.jpg 时，它会查找 __dirname + '/uploads/uploads/C6MGiE-1528523813517.jpg' 但找不到。

您可以通过将请求的图像 URL 更改为 /C6MGiE-1528523813517.jpg 或将服务器代码更改为来修复此问题:

const directory: string = path.join(__dirname, '/uploads');
app.use('/uploads', express.static(directory));