들어가며

최근 조금 메너리즘에 빠졌었다. 애매한 문제를 붙잡고 계속 추적하다보니 텐션이 자연스럽게 떨어졌었다. 오늘은 분위기를 바꾸려고 페어 프로그래밍 느낌으로 팀원이랑 같이 진행했다. 같이 진행하니까 작업 긴장감이 생겨서 많은 진전이 있었다.

Redux-persist를 통한 로그인 상태 관리

Redux를 쓰면 상속을 꼼꼼하게 안해줘도 되는게 너무 편하다. 로그인 상태를 컴포넌트에 한땀한땀 내려주면 얼마나 귀찮았을까? 코드가 깔끔해지고 개발 속도가 굉장히 빨라진다. 이건 안쓰면 손해일 정도.

서버에서 토큰을 확인할 때 로그인 상태를 헤더로 받아오게 만들었다. 클라이언트는 토큰을 확인하는 요청의 응답을 받고 헤더를 참조해서 상태를 변경시킨다. checkIsLogin 함수에 res, error 값만 넣으면 로그인 상태를 변경시켜준다.

import { setIsLogin } from '../modules/isLogin';
import { store } from '../index';

export function checkIsLogin(res) {
  console.dir(res);
  let isLogin = false;
  if (!!res.response) isLogin = res.response.headers.islogin;
  else isLogin = res.headers.islogin;
  console.log(isLogin);
  store.dispatch(setIsLogin(isLogin === 'true'));
}

로그인할 때 이메일 저장?

이 부분은 정말 고민을 많이했다. cookie에 저장하든 localstorage에 저장하든 평문으로 저장되는 시점에서 노출할 수 있는 위험이 생기게 된다. 결국 암호화한 이메일이 저장되어야 하는데...

개발 코스트가 너무 커지고 그럼에도 불구하고 이메일을 클라이언트에 저장한다는게 걸린다. 결국 이메일 저장 아이디어는 폐기하기로 결정. 감당할 수 없는데 억지로 붙잡고 있지 말자. 현업에서 어떻게 아이디 저장을 극복하는지 궁금해졌다.