Angular 加载资源失败：服务器响应状态为500（内部服务器错误）。当我尝试上载图像时，会发生此错误

我是新来指发展的。我有两个输入字段和一个带有照片上传按钮的字段。虽然我设法在屏幕上显示上传的照片，但在服务器上上传时遇到了问题。有人能帮忙吗

我也得到了这个错误：

Error: ENOENT: no such file or directory, open 'C:\Something\Something\Something\Practice\finalappbackend\backedn\images\title-i-entered-1623300156286.jpeg'

以下是我在后端的代码：

app.js

const multer = require("multer");

const MIME_TYPE_MAP = {
  "image/png": "png",
  "image/jpeg": "jpeg",
  "image/jpg": "jpg",
};

const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    const isValid = MIME_TYPE_MAP[file.mimetype];
    let error = new Error("Invalid mime type");
    if (isValid) {
      error = null;
    }
    cb(error, "backedn/images");
  },
  filename: (req, file, cb) => {
    const name = file.originalname.toLowerCase().split(" ").join("-");
    const ext = MIME_TYPE_MAP[file.mimetype];
    cb(null, name + "-" + Date.now() + "." + ext);
  },
});


app.post(
  "/api/posts",
  multer({ storage: storage }).single("image"),
  (req, res, next) => {
    const post = new Post({
      title: req.body.title,
      content: req.body.content,
    });
    console.log(post);
    post.save().then((result) => {
      res.status(201).json({
        message: "Post added successfully",
        postId: result._id,
      });
    });
  }
);

这是我在前端的代码：

posts.service.ts

addPost(id: string, title: string, content: string, image: File) {
    const postData = new FormData();
    postData.append("title", title);
    postData.append("content", content);
    postData.append("image", image, title);
    this.http
      .post<{ message: string; postId: string }>(
        'http://localhost:3000/api/posts',
        postData
      )
      .subscribe((responseData) => {
        const post: Post = {id: responseData.postId, title: title, content: content}
        this.posts.push(post);
        this.postsUpdated.next([...this.posts]);
      });
  }

和post-create.component.html

<div>
      <button mat-stroked-button type="button" (click)="filePicker.click()">
        Pick Image
      </button>
      <input type="file" #filePicker (change)="onImagePicked($event)" />
</div>

拾取图像

解释 enoint表示：错误无条目。如果您查看错误：

Error: ENOENT: no such file or directory, open 'C:\Something\Something\Something\Practice\finalappbackend\backedn\images\title-i-entered-1623300156286.jpeg'

这意味着：我无法打开

“…finalappbackend\backedn\images”

将图像保存到，因为此目录不存在

在

注意：提供时，您负责创建目录 目的地作为一个函数。当传递字符串时，multer将 确保已为您创建目录

行动

---

确保已创建目录。可能是名字中的输入错误。

谢谢，你说得对。。有时是一些小事：/

Error: ENOENT: no such file or directory, open 'C:\Something\Something\Something\Practice\finalappbackend\backedn\images\title-i-entered-1623300156286.jpeg'