로그인 (user authentication) 기능 만들기

이제 video model 만드는 법을 배웠으니 똑같이 user model을 만드는 곳에 응용하면서 로그인까지 만들어보자

대망의 user authentication

로그인은 이렇게 하게 된다.

1. user model(Schema) 만들기

2. Join form에서 post로 필요한 데이터 받기

3. controller에서 req.body로 받아서

4. User.create()로 db에 저장

4-1. 저장하기 전에 bcrypt로 비밀번호 해싱하기

5. 로그인 controller 만들기

5-1. ID 존재 확인

5-2. PW일치 확인

6. 세션에 로그인 정보 남겨주기

이제 세션에 로그인 정보가 담겼으니 모든 req에 세션 id를 담아서 보낸다. 

백엔드와 브라우저의 연결은 와이파이처럼 지속된 연결이 아니다.

render나 redirect가 완료되면 연결이 끊어지는 것처럼

그저 요청하고 응답하는 과정이고 응답이 완료되면 더 이상 연결이 없다는 점을 알면

왜 쿠키와 세션에 대해 배워야 하는지 이해할 수 있다.

 

재미있었던 부분에 대해 기록을 남겨보고자 한다.

 

4-1. 저장하기 전에 bcrypt로 비밀번호 해싱하기 

우리가 어떤 서비스에 가입하고 비밀번호를 알고 싶을 때 그냥 기존에 비밀번호만 알려주면 편할 텐데 재설정을 하게 만드는 게 

다들 왜 그럴까 참 궁금했는데 그 이유를 알 수 있었다.

왜냐하면 서비스 운영자도 모르기 때문이다. 우리가 지정한 비밀번호가 그대로 데이터베이스에 저장되면 

데이터베이스에서 비밀번호가 적나라하게 노출될 것이고 해킹의 위험도 있고, 그런 일이 있을 거라고 믿고 싶지 않지만

서비스 내부 직원이 비밀번호 및 개인정보를 악용할 수도 있다. 

그래서 우리가 회원가입을 할 때 비밀번호는 회사도 모르고 운영자도 모르도록 암호를 걸어야 한다. 

내 비밀번호가 1234라도 절대 그렇게 조회되지 않도록 만드는 게 해싱이다. 

해싱에 대한 자세한 정보는 노마드코더님 유튜브에도 잘 설명되어 있다. 

https://www.youtube.com/watch?v=67UwxR3ts2E

 

bcrypt라는 것을 사용해서 user가 만들어져서 db에 저장되기 전에 항상 hashing을 할 수 있도록 하자.

pre("save")를 쓰면 된다. 여기서 this.password는 이 User model로 만들어지는 실제 user의 password를 가리킨다. 

데이터베이스에 해싱되어 저장된 내 비밀번호다. 실제로는 12라는 값이다. 

이 함수는 결정적 함수로써 input이 같다면 항상 똑같은 output을 가져온다. 이 점을 이용하면 나중에 로그인할 때

유저가 입력한 값을 똑같이 해싱해서 비교(compare)만 하면 된다. 일치 여부만 판단하면 되니까.

그럼 유저의 비밀번호를 몰라도 유저가 비밀번호를 제대로 입력했는지, 틀렸는지는 판단할 수 있다.

 

 

6. 세션에 로그인 정보 남겨주기

세션은 무엇이고 쿠키는 뭘까? 아직도 명확히 이해는 안 되지만 지금까지 이해한 내용에 대해 남겨본다.

http프로토콜 환경, 쉬운 말로 하면 브라우저와 백엔드 사이의 통신? 연결? 은 stateless 하다.

와이파이처럼 계속 연결되어있는 게 아니라 req,res가 끝나면 끊어진다. 그래서 백엔드에서는 

매번 req마다 이 req가 누구의 req인지 확인을 해야만 한다. 그래야 회원인지 비회원인지 구분할 수 있기 때문이다.

그래서 서버에서 memory로 관리하며 브라우저에게 넘겨주는 게 session id이다.

그걸 저장하는 곳이 브라우저의 쿠키이고.(누군가 보신다면 제가 틀린 부분에 대해 지적해주세요 ㅠㅠ)

서버에서 session을 사용하도록 설정한다. secret과 dburl은 환경변수 처리했다. 

이제 브라우저는 서버로부터 session id를 부여받아서 매번 req에 같이 보내게 된다.

나는 이제 postLogin에 가서 ID, PW를 다 확인하고 일치하는 user가 db에 있는지 확인되고 나면 

그 회원이 사용하는 브라우저의 session에 로그인 정보를 입력해줄 것이다. 그러면

그 회원이 보내는 모든 req는 우리의 회원이라고 인식할 수 있다.

이렇게 session object에 loggedIn 과 user 를 넣어주게 되었다.

앞으로 loggedIn true를 확인하면 회원인지 아닌지 알 수 있다. 그리고 세션에 user 데이터가 들어있다는 점을 기억하면

유용한 기능을 추가할 수 있을 것이다. 

 

이런 클라이언트, 서버, 데이터베이스의 조합이 코딩의 가장 재미있는 포인트 같다.