[앱삼] 9. (fullStack) Cookie-based JWT 회원 인증 구현하기 -1 (로그인 중복확인)

1. Cookie 기반의 JWT Auth 구현 이유

- 웹과 앱의 로직 연동 용이성을 위해

- CORS 확장성 문제

- REST API

- 서버의 리소스를 아낄 수 있음

- 무겁거나 중요한 정보를 클라이언트에 저장할 필요가 없음(당장은)

차근차근 해보자

2. 로그인 구현 - 아이디 중복과 비밀번호 중복 확인하기.

(frontend) SignIn.jsx

이미지가 너무 작아서 안보이려나

- setState 가 비동기 함수 이기때문에, 이걸 처리하느라 시간을 은근 많이 사용했다.

- id/ps 둘 중 하나라도 적지 않으면 로그인 버튼을 disabled 시키고 싶어 onChange 함수에 setState를 두번 사용해서 비동기처리를 해서 동기적으로 작동하게 로직을 짤까 했는데, useState를 통해 state를 의존성으로 업데이트해주면 동기적으로 잘 작동했다.

- 앞으로는 state를 여러번 바꾸는 경우 의존성에 따라서 순차적으로 useState를 이용하면 될 것 같다.

- new Promise로 state변경함수를 처리하는 방법도 있을 것 같다.

 

(backend) signin.js

알록달록 이쁘긴 한데 코드스냅의 단점이 크기가 커지면 캡쳐가 거시기하다.

- id 를 찾고, if문 충접으로 분기를 나눠주어 send 해주었다.

- 로그이벤트 미들웨어 나중에 손 볼 때 고생 좀 하겠다. 일단 메인로직부터 정리하고 그 다음에 에러로그 등을 정리해야겠다.

- jwt 생성 및 통신은 내일 포스팅 해야겠다.