react , react-router 유저 페이지 보안 질문

Question

안녕하세요 react , react-router 보안으로 궁금한게 있어서 질문합니다. 웹에서 로그인을하면 user id 가 담긴 token 을 session 에 저장하는 방식으로 마이페이지 접근시 session 확인후 해당 페이지를 접근하도록 했습니다. 근데 문제가 크롬 개발자에서 session 을 강제적으로 지우고 다시 들어가거나 or 뒤로가기로 접근하면마이페이지가 그냥 들어가집니다.이럴경우 React 는 session 이 만료 된것을 인지하지 못하는데지속적으로 서버에 요정하여 로그인 상태를 확인하는건 낭비라고 생각합니다. 새로 고침하면 다시 로그인하라는 경고문이 뜨지만... 이런경우 어떻게 해결하나요?? session 이 지워진걸 React 에서는 어떻게 감지하고 state 를 전달 수정하나요??(참고로 apollo 를 이용하여 개발했습니다.)

아로시 · Answer

근쓴이가 이야기하는 세션이 서버의 세션이 아닌 리액트 내부에서 동작하는 state 라고 가정하고 말씀드리겠습니다. 일단 최상위 컴포넌트 (app.js와 같은) 에서 세션(state)을 검증하는 작업을 하셔야 합니다. (세션이 존재하는지 유무) 해당 작업은 실제 서버와의 교류가 아닌 리액트 내에 존재하는 state 세션을 검증하는 방법입니다.라이프 사이클 내에서 컴포넌트가 마운트 되거나 생성되기 전 시점에 이 부분을 추가 해주시면 될 것 같습니다. 또한 별개로 실제로 서버를 호출하는 상황에 있어서는서버 내에 각 API 에 접근할 때마다 token 이나 세션을 검증하는 (interceptor 나 filter)를 과정또한 포함되어있어야 합니다. 사실 리액트를 만져본지도 오래됐고 다른 프레임워크에 비해 배움도 얕아서 정확한 진단일지는 모르겠으나 유사한 형태로 vue 에서 사용했었습니다.

JJunpro · Answer

답변 감사합니다. 대강 어떻게 해야 좋을지 힌트를 얻은거 같습니다!! 감사합니다.~ graphql 로컬 저장소와 서버 값을 비교하면서 하면 대강 될꺼같아요

react , react-router 유저 페이지 보안 질문

2개의 답변

Q&A 목록