上传文件后Multer的路径提供了我机器中的完整相对路径

Question

所以我是后端和节点的新手，并且一直在开发一个应用程序，该应用程序在创建新项目时也应该支持图像文件上传。

我一开始遇到此错误

ENOENT: no such file or directory

，但在遵循此处的答案之后（我使用的是 Windows 计算机，并且正在遵循 Mac 上的教程） ENOENT：没有这样的文件或目录.?

我已改用 __dirname 与

path

一起使用，并且不再出现此类错误。

我现在面临的是另一个问题：

1. 当我要求

   file.path

   时，它不再像

   ./uploads

   那样是相对的，而是我计算机上的完整路径

   C:\Users\myuser\Documents\Coding\travel-market\api\src\uploads\2022-12-05T12-39-35.924Z-Screenshot 2022-11-02 193712.png

因此，当我拉出该新项目并尝试渲染图像时，它不会显示。我也收到此错误

Not allowed to load local resource

。

这样可以吗？一旦 API 实际托管在服务器上就可以正常工作吗？或者是否有不同的方法可以让我在本地开发时也可以查看图像？

这是我现在保存的全部代码：

const storage = multer.diskStorage({
    destination: function(req, file, cb) {
        cb(null, path.join(__dirname, "..", "uploads"));
    },
    filename: function(req, file, cb) {
        const uniqueName =
            new Date().toISOString().replace(/:/g, "-") + "-" + file.originalname;
        cb(null, uniqueName);
    },
});

const fileFilter = function(req, file, cb) {
    if (!file.originalname.match(/\.(jpg|jpeg|png)$/)) {
        return cb(new Error("Please upload an image file"));
    }

    cb(undefined, true);
};

const upload = multer({
    storage,
    limits: {
        fileSize: 1024 * 1024 * 5, // This number is in bytes, so this is 5mb
    },
    fileFilter,
});

// Post a new plan
router.post("/plans", auth, upload.single("plan_image"), async(req, res) => {
    console.log("this is the file", req.file);
    const details = JSON.parse(req.body.details);
    console.log("this is the body", details);

    const plan = new Plan({
        ...details,
        image: req.file.path,
        author: req.user._id,
    });

    try {
        await plan.save();
        res.status(201).send(plan);
    } catch (e) {
        console.log("failed to save", e);
        res.status(400).send(e);
    }
});

Answer 1

你可以像这样配置multer

const upload = multer({dest:'uploads/'});

这里我将文件保存到上传文件夹。这将获取像“上传/文件名”这样的相对路径，而不是完整路径。

Windows 的问题是，它用 "\" 字符指定路径，这将导致 multer api 选择这样的路径 - "uploads ilename" 但它应该在基于 Unix 的服务器中正常工作Mac 和 Linux 等系统，路径用 "/" 指定。

Answer 2

最简单的解决方案是：

const path = require("path");
const imageUrl = path.relative(__dirname, req.file.path);

借助 pathh.relative 预建函数，您将能够轻松提取相对路径。