dev) 2/7 로그인/로그아웃 최종 완성, 관리자 계정

1. 로그인 로그아웃 관리자 계정 로그인

 

! 현재 로직은 보안상 아주 위험한 로직이지만 우선적으로 기능 구현 후 리팩토링 할 예정입니다.

 

관리자 로그인

 

로그인 시 ID가 관리자의 ID인 경우

localstorage에 key와 value를 role과 admin으로 값을 저장

 

아닐 경우 (일반 유저)

백엔드로 부터 JWT 토큰을 발급 받아 localstorage에 저장

 

해당 로직 완성 전 마주친 에러와 해결한 방법

 

1. 로그인 완료후 navigate로 메인페이지로 이동하자 새로고침이 생기지 않아서

localstorage에 token을 가지고 있는 status가 인식되지 않음

 

2. 따라서 window.location.href로 전체 페이지 새로고침으로 유저의 token status를 인식시킴

(로그아웃도 마찬가지로 window.location.href 적용)

 

(네이버, 사람인 홈페이지를 참고 하였더니 해당 사이트들은 아예 로그인 버튼 클릭 시 다른 화면으로 이동시킨 후 로그인 완료 후 전체를

재 랜더링 했던 것을 참고하였습니다.)

 

프로젝트 기간 안에 해당 로직을 jwt토큰에서 user role을 추출하여 role로 일반 회원, 관리자, 비회원을 구분하는 로직으로 변경 예정

 

 

---

 

 

2. 관리자 계정 기능

 

jwt 토큰의 value가 admin일 경우 해당 메뉴를 출력하지 않고 토큰의 값이 null이 아닌경우 UserMain으로 이동 비회원일 경우 로그인 이동

 

해당 로직에서는 삼항 연산자를 이용하여 관리자일 때 출력하는 헤더의 메뉴와 user의 NavLink, 비회원의 NavLink의 값에 변화를 주어

기능을 분리하였다.

 

해당 로직에 대한 리팩토링 고민

 

1) 삼항 연산자가 두번 들어가면 코드의 해석에서 가독성이 떨어 질 것 같아서 다른 방식을 고민중이다.

2) Admin에게 필요없는 UserMain NavLink를 <></>로 보이지 않게 처리 하였으나

단순한 방식이어서 혹시 더 나은 방식이 있는지 고민중이다.