userController.js

export const postEditProfile = async (req, res) => {
  const { body: { name, email }, file } = req;
   try{
    const user = await User.findByIdAndUpdate(req.user._id, {
      name,
      email,
      avatarUrl: file ? file.path : req.user.avatarUrl
    });
    user.save();
    res.redirect(routes.me);
   }catch(error){
    res.render("editProfile", { pageTitle: "Edit Profile" });
   }
};
  • file ? file.path : req.user.avatarUrl
  • 파일이 있으면 업로드한 파일 경로를, 그게 아니라면 유저가 갖고 있는 기존의 아바타url 사용

middlewares.js

...
const multerAvatar = multer({ dest: "uploads/avatars/" });
...
export const uploadAvator = multerAvatar.single("avatar");
  • 미들웨어에서 uploadAvator 물터 경로 설정

userRouter.js

...
import { onlyPrivate, privatePublic, uploadAvator } from "../middlewares";
...
userRouter.post(routes.editProfile, onlyPrivate, uploadAvator, postEditProfile);
  • 유저 프로필 수정 라우터 중간에 uploadAvator 미들웨어 추가

editProfile.js

form(action=`/users${routes.editProfile}`, method="post", enctype="multipart/form-data")
            .fileUpload
                label(for="avatar") Avatar
                input(type="file", id="avatar", name="avatar", accept="image/*")
            input(type="text", placeholder="Name", name="name", value=loggedUser.name)
            input(type="email", placeholder="Email", name="email", value=loggedUser.email)
            input(type="submit", value="Update Profile")
  • enctype="multipart/form-data" 추가