[MEMO APP] Back-end/ REST API+Session&Token-Login

 

👨‍💻 REST API-Login

지난 포스팅에서 저희는 RegisterLocal 기능을 완성시켜주었습니다. 오늘은 회원가입된 정보를 이용해서 로그인을 처리해주는 Controller method를 만들어보도록 하겠습니다.

📌 Login Controller method

Login 관련 데이터처리는 authentication과 관련되어 있으므로 auth.ctrl.js에서 작업을 해줄겁니다. 일단 해당 파일을 열어주시기 바랍니다.

아래의 사진에 하이라이트 부분을 지금부터 작업해주겠습니다.

일단, 로그인에서도 유저(=클라이언트)로부터 보내진 데이터가 있을겁니다. 로그인이니깐 email, password정도가 되겠네요.

 

이 보내진 email과 password는 우리가 원하는 형식인지 검증해주는 절차를 회원가입때와 마찬가지로 진행해주어야 합니다.

(다시한번 Joi를 사용해야겠네요.)

검증이 실패했을경우 클라이언트에게 오류메시지가 나타나도록 설정을 해주는 소스도 추가해 주겠습니다.

그 다음엔 검증된 정보를 가지고 이정보(email, password)가 데이터베이스에 실제로 존재하는지 검사하는 소스코드도 만들어주도록 할게요.

 

일단 데이터베이스에 관련한 작업임으로 try catch 블록안에서 작업을 진행할게요.

이전에 우리가 User.js에서 만들었던 email을 가지고 DB에서 특정 데이터를 추출하는 findByEmail함수를 사용하겠습니다.

User.js에서 findByEmail 메서드

auth.ctrl.js에서 loginlocal 메서드

위의 그림에서 86번째줄처럼 찾아서 가져온 유저의 정보가 존재하는지 아닌지에 따라 로그인을 처리해주는 일종의 조건문을 만들어주겠습니다.

(여기서 최종적으로 해당 email의 정보를 가진 유저데이터가 있는지 검증합니다.)

이부분을 잘 통과했다면, 우리가 email정보말고 받은 또다른 정보인 password가 해당 유저DB data의 정보와 일치하는지를 검증해주어야 합니다.

(여기서 Password일치여부를 검증합니다.)

 

이를 검증하기 위해서는 User Database에 접근해야하는데요, 그래서 User.js에 User의 password 정보와 일치하는지 검증시켜주는 함수를 새롭게 만들어주도록 하겠습니다.

그리고 이 함수를 auth.ctrl.js에서 사용해서 password검증절차까지 완성해 주도록 하겠습니다.

다시 auth.ctrl.js 파일을 열어주세요.

(email을 가지고 유저정보 검증했던 조건문처럼 password 검증도 비슷하게 소스코드를 구성해줍니다.)

여기까지 해주셨다면 유저가 보낸준정보가 DB에 존재하는지에 대한 검증하는 절차는 완료가 되었습니다.

하지만 여기까지만 한다면 로그인이 지속적으로 유지가 되어지지 않을겁니다.

회원가입에서와 마찬가지로 Web Token을 이용해서 로그인을 유지시켜주어야 하는데요, 그 절차를 지금 만들어주도록 하겠습니다.

이렇게 작성해주면 로그인정보를 담은 데이터(Token)이 담긴 세션이 만들어집니다.

(클라이언트에서는 이를 이용해 로그인을 유지시켜주면 됩니다.)

 

위 사진에서 아래에 catch 블록 위의 내용은 추후 리액트에서 사용하기위해 보내주는 정보임으로 아직 작성을 안해도 무관하나 응답메시지를 따로 지정을 해줘야 함으로 따라서 작성해주셔도 무관합니다.

(아래 사진을 참고해주세요.)

여기서 끝나는것이 아니라 우리가 만든 loginLocal method를 우리의 특정 URI에 연결을 해줘야합니다.

이를 위해서 auth/inde.js 파일로 이동을 하겠습니다.

위에 하이라이트한 부분이 우리가 미리 만들어두었던 Login을 위한 URI입니다.

뒤에 있는 Arrow function이 방금 우리가 만들었던 loginLocal 함수가 들어갈 자리입니다.

 

바로 위에 있는 회원가입 URI코드처럼 수정을 해주도록 하겠습니다.

이렇게 해주면 해당경로로 로그인을 시도하는것이 가능해집니다.

한번 서버를 켜고 PostMan을 이용해 테스트를 진행해 보도록 하겠습니다.

(테스트시 사용하는 데이터는 아래와같이 회원가입때 사용한 정보를 활용하도록 하겠습니다.)

아래의 사진처럼 PostMan 하단에서 그결과로 Cookie 안에 accsee_token이 생성된것을 확인이 가능합니다.

이 정보가 올바르게 만들어졌는지 https://jwt.io/ 사이트로 이동해서 검사를 해보도록 하겠습니다.

 

오늘 포스팅은 여기까지입니다. 저희는 REST API기반 회원가입과 로그인 기능을 구현해주었습니다.

 

조금 기나긴 내용이었는데요, 다음 포스팅에서는 한템포 쉬어가는 시간으로 저희가 만드는 서비스의 속도나 효율적인 측면을 상승시켜줄 미들웨어 몇개를 설정해 주도록 하겠습니다.

 

다음 포스팅에서 뵐게요~!😉