ch8. User profile

0. edit profile get

• uploading file 연습할거임

[middleware.js]
res.locals.loggedInUser = req.session.user || {};

[edit-profile.pug]
extends base

block content 
    form(method="POST") 
        input(name="name", type="text", required, placeholder="Name", value=loggedInUser.name)   
        input(name="email", type="text", required, placeholder="Email", value=loggedInUser.email)  
        input(name="username", type="text", required, placeholder="Username", value=loggedInUser.username)
        input(name="location", type="text", required, placeholder="Location", value=loggedInUser.location)
        input(type="submit", value="Update Profile")

로그인안된상태에서 >> edit profile버튼없이 주소에 쳐서 들어올경우 에러남 >> route보고할 middelware필요함 >>

1. protector, public middlewares

• 1. middleware 생성

export const protectorMiddleware = (req, res, next) => {
  if (req.session.loggedIn) {
    next();
  } else {
    return res.redirect("/");
  }
};

export const publicOnlyMiddleware = (req, res, next) => {
  if (!req.session.loggedIn) {
    next();
  } else {
    return res.redirect("/");
  }
};

• 2. router에 적용
  • all >> get, post 둘다에 적용시킴

import { protectorMiddleware, publicOnlyMiddleware } from "../middlewares";

const userRouter = express.Router();

userRouter.get("/logout", protectorMiddleware, logout);
userRouter.route("/edit").all(protectorMiddleware).get(getEdit).post(postEdit);
userRouter.get("/github/start", publicOnlyMiddleware, startGithubLogin);
userRouter.get("/github/finish", publicOnlyMiddleware, finishGithubLogin);

2. edit profile post 

• req.session 에서 id도 얻을수 있음
• findByIdAndUpdate 사용할거

export const postEdit = async (req, res) => {
  const {
    session: {
      user: { _id },
    },
    body: { name, email, username, location },    <<
  } = req;
  await User.findByIdAndUpdate(_id, {    <<    <<    <<
    name,
    email,
    username,
    location,
  });
  return res.render("edit-profile");
};

• 실제로 변경은됐으나 화면에 적요이 안됨 >> 화면에 쓴 value << locals.value << 로그인할때 session에 만든거 >> db 와 session이 연결이 안됨 >> update하면 session update도 같이 해줘야 함
  • 방법1 

 req.session.user = {
    ...req.session.user,
    name,
    email,
    username,
    location,
  };

• 방법2 updatedUser만들기
  • findByIdAndUpdate  >> 그냥옵션안넣고 하면 boolean return함 > new:true 옵션추가하면 업데이트된 객체리턴됨

const updatedUser = await User.findByIdAndUpdate(     <<
    _id,
    {
      name,
      email,
      username,
      location,
    },
    { new: true }     <<     <<     <<
  );
  req.session.user = updatedUser;     <<     <<

• edit 할때 중복여부도 체크해야함 

if (email !== req.session.user.email) {
    const exists = await User.exists({ email });
    if (exists) {
      return res.render("edit-profile", {
        errorMessage: "이미 존재하는 이메일입니다.",
      });
    }
  }

3. change password

• social only true일땐 안함 << password가 없음
• >> 방법 1 >> 깃허브로그인유저는 버튼클릭시 홈으로

export const getChangePassword = (req, res) => {
  if (req.session.user.socialOnly === true) {
    return res.redirect("/");
  }
  return res.render("users/change-password", { pageTitle: "Change Password" });
};

• 방법2. edit-profile에 비번변경 버튼자체가 안보이게하기

if !loggedInUser.socialOnly
            hr
            a(href="change-password") Change Password →

• 1.비밀번호 form값 가져오기 & 새비밀번호 일치여부확인

export const postChangePassword = async (req, res) => {
  const {
    session: {
      user: { _id, password  },
    },
    body: { oldPassword, newPassword, newPasswordConfirmation },
  } = req;
  if (newPassword !== newPasswordConfirmation) {
    return res.status(400).render("users/change-password", {
      pageTitle: "Change Password",
      errorMessage: "비밀번호가 일치하지 않습니다.",
    });
  }
  //send noti
  return res.redirect("/");
};

• 2. 기존비밀번호 확인

const ok = await bcrypt.compare(oldPassword, password);
  if (!ok) {
    return res.status(400).render("users/change-password", {
      pageTitle: "Change Password",
      errorMessage: "기존 비밀번호가 틀렸습니다.",
    });
  }

• 3. 기존 비밀번호 업데이트
  • user.save() >>  pre작동해서 bcrypt작동함 (hashing)
  • save() 하기위해 session로그인된 user를 찾아야 함
  • & session의  password도 업데이트 해야함
  • 변경완료되면 자동 로그아웃되도록하기

const user = await User.findById(_id);

  user.password = newPassword;
  await user.save();
  //send noti
  return res.redirect("/users/logout");
};