custom router1 [React] router v6에서 JWT 인증과 Private 컴포넌트를 통한 화면 접근 보안 구현하기 토이프로젝트 진행 중 서버에서 JWT 인증을 구축한 뒤, 로그인한 경우에만(클라이언트가 정상적인 access_token을 가진 경우에만) 특정 화면에 접근할 수 있도록 하려면 어떻게 해야 할지 고민하게 되었다. 😿 필자의 경우 별도의 Private 컴포넌트를 생성해서 접근하는 순간 자동으로 서버에 access 토큰 인증 요청을 하게 되고, 인증에 실패한 경우는 클라이언트가 해당 화면에 접근하지 못하도록 구현했다. 방식은 간단하다. Route 컴포넌트 element에 실제 접근하려는 컴포넌트 대신 Private 컴포넌트를 전달하고, Private에 컴포넌트에 실제 접근하려는 컴포넌트를 속성으로 넘기면 된다. [TO-BE] const App = () => { return ( ); }; 기존에는 따로 토큰을 .. 2023. 2. 25. 이전 1 다음