일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
- mongoose
- Python
- Sequelize
- Queue
- nodejs
- nestjs
- AWS
- game
- GIT
- 공룡게임
- JavaScript
- Bull
- Dinosaur
- MySQL
- react
- flask
- 정렬
- OCR
- Nest.js
- 자료구조
- class
- MongoDB
- dfs
- jest
- Express
- TypeScript
- cookie
- 게임
- typeORM
- Today
- Total
포시코딩
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
'Node.js' 카테고리의 다른 글
Node+Express 서버와 Vue 연동하기 (0) | 2022.10.06 |
---|---|
Node.js, MongoDB 로 웹서비스 만들기 - 14. 메뉴(navbar) (0) | 2022.06.27 |
Node.js, MongoDB 로 웹서비스 만들기 - 12. 로그인(1) - passport (0) | 2022.06.27 |
Node.js, MongoDB 로 웹서비스 만들기 - 11. 회원가입, 로그인 - bcrypt (0) | 2022.06.26 |
Node.js, MongoDB 로 웹서비스 만들기 - 10. 회원가입(2) - bcrypt 암호화 (0) | 2022.06.10 |