[포스코x코딩온] 풀스택 부트캠프 8주차 정리 -2 (2차 프로젝트 회고)

프로젝트 주제 : 40~60대를 위한 모바일, 컴퓨터 사용 설명서

12/ 15

회원가입, 로그인, 등의 user 정보 측의 백엔드를 맡았다.

database 의 테이블 구조는 user : 게시글 : comment 1 : N : N으로 잡았다.

EC2에 sequelize를 설치해서 서버 데이터베이스에 연결하기까지는 쉽게 성공했으나

MySQL workbench에 EC2의 데이터베이스에 연결하는데는 실패했다.

그 이유를 알아보니

1. 접근 권한이 없었고

2. mysql workbench에서는 ec2 서버에 접근할때 쓰던 ppk 형식의 파일을 좋아하지 않는다.

 

그래서 구글링을 통해 서버 mysql의 config를 수정하고 새로운 RSA를 발급받아서 접속에 성공했다.

 

이후 외래키를 설정할 때 관계 설정이 잘 되지 않아서 조사해보니 외래키의 대상이 되는 taget key는

1. unique 속성을 가지고 있거나

2. primary key여야 한다는 사실을 알게 되었다.

 

 

---

12/ 16

로그인을 할때 refresh token과 access 토큰 (JWT)을 이용하는 방식이 있다고 해서 왜 쓰려고 하는지 이해하려 하였다.

왜 이런 방식을 쓰는지 이해가 가지 않아서 계정 휴면 처리를 하기 위해서 이용하는 게 아닌가 하는 생각을 하였다. (아니다.)

 

그래서 데이터베이스에 들어갔을 때 refresh token을 가져와서 valid 검사를 해서 토큰이 만료되어있으면 휴면처리를 하는 로직을 만들었다. (지금은 삭제했다.)

 

express session의 default store인 session store를 이용했는데 이를 이용하면 서버가 끊기면 세션이 사라진다는 사실을 알게 되었다. 조금의 시행착오가 있었지만 결국 mysql session을 연동에 성공했다.

 

---

12/ 17

refresh token의 방식이 드디어 이해가 갔다.

1. 로그인 시 만료값이 access 토큰보다 수명이 조금 긴 refresh token을 발급해주고

2. 서버는 클라이언트가 refresh token이 있으면 유효성을 검사하고 유효할 경우 access token을 발급해준다.

3. access token이 있다면 서버는 클라이언트가 접근 권한이 있는 것으로 인식한다.

이렇게 이했는데 얼추 맞는 것 같다.

 

그래서 다음과 같은 방식으로 구현했다. 

1. 로그인시 refresh token을 cookie의 형태로 클라이언트에 발급해주고,

2. access token이 없거나 유효하지 않을 경우 , refresh token이 있는지 확인해서 유효성을 검사하고

3. refresh token이 있다면 access token을 새로 발급해주고

4. refresh token이 없다면 access token을 삭제해서 완전히 로그아웃

다만 메인 페이지의 경우

로그인이 되었을 때 - 마이페이지, 로그아웃

로그인이 되지 않았을 때 - 회원가입, 로그인

으로 설정했었기 때문에 ejs에서도 사용할 수 있게 res.locals로  access token을 발급해주었다.

 

다만 한가지 걸리는 것이 session을 이용하지 않기 위해서 token을 쓰는 것이라고 이해했는데, res.locals를 쓰면 session을 이용하는 것이 되기 때문에 이게 의미가 있나...? 싶기도 하다. 나중에 지식이 더 쌓이면 좀 더 좋은 방식을 생각해 낼 수 있지 않을까.

뭐 refresh token은 쿠키에 저장하니까 상관없나..? 라고 생각하자.

 

---

12/ 18

먼저 팀원들의 깃허브 충돌을 핸들링하고 팀원의 작은 에러를 수정했다.

이후 회의를 통해서 단어 연습 데이터베이스를 만들어야 한다는 결론에 도달했다. 이건 추후에 하기로 하자.

 

마이페이지와 에러 핸들러 미들웨어를 만들었다.

 

마이페이지의 경우 로그인하지 않으면 아예 접속할 수 없게 하기 위해 미들웨어를 따로 작성해서 access token이 없을 경우 401 error를 띄우게 만들었다. 만드는 김에 404와 500도 만들었다.

 

마이페이지에 유저 이름바꾸기, 비밀번호 변경, 회원 탈퇴 기능을 넣으려고 했는데 그렇게 되면 서로 다른 form을 3번 요청해야한다. 그래서 axios로 method patch와 delete를 이용하여 구현했다.

 

* 자꾸 data에 value값을 넣지 않고 input element 자체를 집어넣어서 undefined 에러가 발생한다. 조심하자.