Multer 正在抓取图像，但它没有将我的文件保存在正确的目录中

Question

我有一个快递服务器。当用户去对 profiel 发出 post 请求时。他们提交个人资料图片。我正在尝试使用 multer 来获取正在发送的照片/图像并将其存储在后端目录的文件夹中。

我设置了 multer，但由于某种原因，它没有保存任何我希望它保存在本地以便我可以检索它的照片。我该如何解决这个问题。有没有人知道如何解决这个问题。

控制器：

const Profile = require("../../models/UserModels/Profiles.js")
const User = require('../../models/UserModels/Users.js')

const multer = require('multer')
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, '../../client/images/profile/')
  },
  filename: function (req, file, cb) {
    const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9)
    cb(null, file.fieldname + '-' + uniqueSuffix)
  }
})
const upload = multer({ storage: storage })
...
  post:(req, res) => {
    console.log(req.body)
    console.log(req.files)
    upload.single(req.files.profile_pic.name) <----------------
    let body = req.body
    Profile.create({
      profile_pic: req.files.profile_pic.name,
      f_name: body.f_name,
      l_name: body.l_name,
      bio: body.bio,
      location: body.location,
      sm_facebook: body.sm_facebook,
      sm_instagram: body.sm_instagram,
      sm_twitter: body.sm_twitter,
      sm_website: body.sm_website,
      followers: body.followers,
      following: body.following,
      photos: body.photos,
      downloads: body.downloads,
      edits: body.edits,
      userId: body.userId
    })
    .then((data) => {
      res.send(data).status(200)
    })
    .catch((err) => {
      console.error(err)
      res.send(err).status(400)
    })
  },

这是此后端的目录：

-----------更新---------------

这是来自前端的 react axios 请求：

function createProfile(userId){
    let data = new FormData()
    data.append('f_name', firstName)
    data.append('l_name', lastName)
    data.append('bio', bio)
    data.append('location', location)
    data.append('sm_facebook', facebook)
    data.append('sm_instagram', instagram)
    data.append('sm_twitter', twitter)
    data.append('sm_website', website)
    data.append('followers', 0)
    data.append('following', 0)
    data.append('photos', 0)
    data.append('edits', 0)
    data.append('downloads', 0)
    data.append('userId', userId)
    data.append('profile_pic', profilePicture)
    console.log(data)
    axios({
      method: "post",
      url: "/api/profile/",
      data: data,
      headers: { "Content-Type": "multipart/form-data" },
    })
    .then((data) => {
      return(<Navigate to='/' />)
    })
    .catch((err) => {
      console.error(err)
    })
  }

Answer 1

您必须指定 multer 的存储路径，就好像您位于项目的根文件夹中一样。 所以不要使用'../../client/images/profile/'作为存储路径，你应该使用：'./backend/client/images/profile'。

你的代码最终应该如下：

const multer = require('multer')
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, './backend/client/images/profile')
  },
  filename: function (req, file, cb) {
    const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9)
    cb(null, file.fieldname + '-' + uniqueSuffix)
  }
})