Node.js, MongoDB 로 웹서비스 만들기 - 13. 로그인(2)
이전 글에서 로그인 기능을 완성했다면
로그인 후 세션에 유저정보가 잘 저장되어 있는지 확인하는 시간을 가져보자
마이페이지 대충 만들어서 들어가면 유저아이디 나오나 확인할거임
mypage.ejs 를 만들자
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>NFP</title>
</head>
<body>
<h4>님의 마이페이지입니다.</h4>
</body>
</html>member.js 로 와서 mypage 로 가는 라우팅을 해주자
router.get('/mypage', loginCheck, (req, res)=>{
res.render('mypage.ejs', {userSession: req.user});
})평소에 만들던 라우터와 살짝 다른걸 볼 수 있는데
{userSession: req.user} 는 userSession 이라는 이름으로 세션에 담긴 유저정보를 보낸다는 의미이고
'/mypage' 옆 loginCheck 는 마이페이지로 가기전 로그인된 상태인가를 체크하는 미들웨어다.
미들웨어는 요청을 받고 응답을 보내는 그 중간에서 실행되는 함수들을 의미함
loginCheck 미들웨어를 만들어보자
function loginCheck(req, res, next){
if(req.user){
next()
} else {
res.send('로그인안하셨는데요? <a href=\"/member/login\">로그인</a>');
}
}세션에 유저정보가 있으면 그냥 지나가게 놔두고
없다면 당장은 중요하지 않으니 간단하게 로그인 해야된다는 글귀가 나오게 작성했다.
이제 /mypage 로 갈 때 세션정보가 전달되게 됐으니 아이디가 나오게 수정해주자
<h4><%= userSession.id %> 님의 마이페이지입니다.</h4>이게 html 대신 ejs 쓰는 이유임
전달한 js 값을 위처럼 사용해서 출력이 가능하다.
저장 후 테스트해보면 아이디가 잘 나오는걸 확인할 수 있다.
Node.js, MongoDB 로 웹서비스 만들기 - 14. 메뉴(navbar)
지금껏 로그인하거나 마이페이지를 가거나 할 때 직접 url 에 입력해서 이동하거나 간단하게 버튼을 급조해 사용했는데 navbar 를 만들어보자 NFP 임시 로그인 bootstrap 을 이용해 간단하게 구현했
4sii.tistory.com