출처 : 인프런_따라하며 배우는 노드, 리액트 시리즈 — 기본 강의
Auth route 를 만들어보자.
로그인 된 유저만 게시판에 글을 쓸 수 있게 한다던가, 지정된 페이지에 접근할 수 있게 하는 기능을 위한것이다.
- 저번 시간 복습
- 토큰 생성 후 User 정보에 넣고 Server에는 UserDB에 넣고, Client에서는 쿠키에 저장했다.
- 그리고 Server의 Token과 Client의 Toekn을 계속 비교하면서 맞는지 체크한다.
- 만약 유저가 A page -> B page 로 이동할때, B page에 접근 가능한지 체크하는 과정
1) Client에서 쿠키에 담긴 정보를 Server에 전달한다.
2) Server는 Encode 된 쿠키를 받아서 Decode를 하고 그러면 User ID 가 나온다. ID 가 Server 쪽의 User DB에 있으면 인증되는 것이다. ('user._id + 'secrete Token' 해서 토큰을 생성했음. 디코드할때는 secretToken을 넣으면 user._id가 나옴.
그래서 user)
[결론]
1. Cookie에서 저장된 Token을 Server에서 가져와서 복호화를 한다.
2. 복호화를 하면 User ID가 나오는데 그 User ID를 이용해서 데이터베이스 User Collection에서 유저를 찾은 후 쿠키에서 받아온 token이 유저도 갖고 있는지 확인한다.
3. 쿠키가 일치하면 Authentication이 true이다. 그리고 그에 해당하는 유저의 정보들을
Step 1) findByToken 메소드 작성
- 가져온 토큰을 디코드하는 findByToken 메소드를 User.js에 정의해보자
userSchema.statics.findByToken = function(token,cb){
var user = this;
//가져온 토큰(token)을 디코드한다.
jwt.verify(token, 'secretToken', function(err,dcoded) {
//유저 아이디(decoded)를 이용해서 유저를 찾은 다음,
//클라이언트에서 가져온 token과 DB에 보관된 token이 일치하는지 확인
//findOne()는 MongoDB에 이미 있는 함수임. id와 token으로 찾을것
user.findOne({"_id" : decoded, "token": token}, function(err,user){
if(err) return cb(err) //에러 있으면 콜백으로 에러 전달
cb(null, user) //에러 없으면 유저 정보 전달
})
})
}
아래의 형식으로 디코드한다. (참고 : www.npmjs.com/package/jsonwebtoken)
jwt.verify(token, 'shhhhh', function(err, decoded) {
console.log(decoded.foo) // bar
});
Step2) 미들웨어 생성
middleware폴더를 생성하고 그 아래에 auth.js 파일을 생성한다. 이곳에서 유저 인증을 처리해보자.
- 미들웨어 : endpoint에서 request를 받은 다음 call back function 실행 전에 중간에서 실행되는 것.
작성한 코드는 아래와 같다.
const { User } = require('../models/User');
let auth = (req, res, next) => {
//인증 처리를 하는 곳
//1. 클라이언트 쿠키에서 토큰을 가져온다. cooike-parser 이용
let token = req.cookies.x_auth;
//2. 토큰을 복호화한 후 유저를 찾는다. 유저 모델에서 메소드 만들어서
User.findByToken(token, (err,user) => {
if(err) throw err;
if(!user) return res.json({ isAuth: false, error: true}) //유저가 없을 때. 클라이언트에 전해줌.
//유저가 있으면 유저 정보 넣어줌 ~> User.js에서 req를 통해 유저 정보에 접근 가능해짐
req.token = token;
req.user = user;
next(); //미들웨어 끝나고 다음으로 넘어갈 수 있도록 해줌
})
//3. 유저가 있으면 인증 Ok
//4. 유저가 없으면 인증 NO
}
module.exports = {auth}; //auth를 다른 파일에서도 쓸 수 있게 해줌
Step 3) index.js- 인증 부분 추가
//Authentication 인증 부분
app.get('/api/users/auth', auth , (req,res) => { //auth : 미들웨어 ->
//미들웨어 auth에 문제 생겨서 false가 되면 미들웨어내에서 return돼서 다른 곳으로 빠져나감.
//즉, 여기까지 미들웨어를 통과해 왔다는 얘기는 Authentication이 True 라는 말
//True니까 유저 정보를 클라이언트에 전달해주면 됨
res.status(200).json({
_id: req.user._id,
isAdmin: req.user.role === 0 ? false : true, //관리자 유저인지 아닌지. role이
isAuth: true,
email: req.user.email,
name: req.user.name,
lastname: req.user.lastname,
role: req.user.role,
image: req.user.image
})
})
만약, A page 의 어드민의 role이 1이고, B page의 어디민의 role이 2이라면 그때에 따라 isAdmin 줄의 코드는 다르게 작성할 수 있다.
지금은 role==0이면 일반 유저, role != 0 이면 관리자라고 가정해서 위와 같이 코드를 작성했다.
'Node & React > Basic Study' 카테고리의 다른 글
[MAC] Node/React 기초 - Creat React App과 NPX 장점 (0) | 2021.01.16 |
---|---|
[MAC] Node/React 기초 - 로그아웃 기능 (0) | 2021.01.16 |
[MAC] Node/React 기초 - 로그인 기능 (0) | 2021.01.14 |
[MAC] Node/React 기초 — MongoDB에 데이터 암호화하여 올리기 (0) | 2021.01.14 |
[MAC] Node/React 기초 — Body Parser, POSTMAN,Register Router, NODEMON 설정하기 (0) | 2021.01.14 |