프로젝트를 진행하면서, 인증이 필요한 HTTP 요청에는 JWT와 Axios Interceptor를 활용해 인증 로직을 구현했습니다.하지만 단순한 페이지 간 라우팅에서는 사용자의 권한 여부와 관계없이 접근이 가능했기 때문에, 보안상의 허점이 발생할 수 있었습니다. 이를 해결하기 위해, React Router의 PrivateRoute를 활용해 인증이 필요한 페이지에 대한 접근을 제어하려고 합니다.이번 글에서는 PrivateRoute를 구현하여 인증되지 않은 사용자가 보호된 페이지에 접근하지 못하도록 적용하여 그에 대해서 포스팅하겠습니다. 먼저 페이지에 대한 접근을 제어하기 위해서 아래와 같이 AppRoutes를 구성해 줍니다.- AppRoutesconst AppRoutes = () => ( ..

axios가 제공하는 interceptor는 HTTP 요청이나 응답이 처리되기 전에 가로채서 특정 로직을 먼저 실행할 수 있도록 해줍니다.이를 통해서 공통된 처리 로직을 모듈화하거나 자동화할 수 있습니다. https://axios-http.com/kr/docs/interceptors 인터셉터 | Axios Docs인터셉터 then 또는 catch로 처리되기 전에 요청과 응답을 가로챌수 있습니다. axios.interceptors.request.use(function (config) { return config; }, function (error) { return Promise.reject(error); }); axios.interceptors.response.use(faxios-http.com해당 페이지..

개인 프로젝트를 진행하며 휴대폰 인증을 구현한 내용을 적어놓겠습니다. 버전Spring boot: 3.3.4Java: 17로직 구현시 고려사항1. 어뷰징성 요청 방지메세지 전송에는 비용이 들어갑니다.따라서, 의미없는 어뷰징성 요청을 방지하기 위해서 요청횟수에 제한을 둘 필요가 있습니다. 2. 인증문자 폐기인증문자를 전송 후 인증 문자를 계속해서 사용할 수 없도록 전송된 인증문자를 파기할 필요가 있습니다. 인증번호 관리위의 고려사항을 생각해서 인증번호를 어떻게 관리할지에 대해서 생각해봐야합니다.인증번호를 관리하는 방식에는 여러가지 방법이 있습니다. 1. RDBMS관계형데이터베이스를 이용해서, User 테이블 또는 인증번호 관리 테이블을 생성해서 인증번호를 관리합니다.만료시간과 어뷰징 방지를 위해서 컬럼(예:..