From e5cde7aec1e453aa67cd55c95bb3bc018da2d7b0 Mon Sep 17 00:00:00 2001 From: lukatheleopard Date: Thu, 28 Aug 2025 09:22:43 +0900 Subject: [PATCH 1/2] =?UTF-8?q?Fix(Router):=20=EB=AA=87=EB=AA=87=20?= =?UTF-8?q?=EB=9D=BC=EC=9A=B0=ED=8A=B8=EC=97=90=EC=84=9C=20=EB=B8=8C?= =?UTF-8?q?=EB=9D=BC=EC=9A=B0=EC=A0=80=20=EB=92=A4=EB=A1=9C=EA=B0=80?= =?UTF-8?q?=EA=B8=B0=20=EB=B2=84=ED=8A=BC=EC=9D=B4=20=EC=A0=95=EC=83=81=20?= =?UTF-8?q?=EC=9E=91=EB=8F=99=ED=95=98=EC=A7=80=20=EC=95=8A=EB=8A=94=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/routes/index.jsx | 771 +++++++++++++++++++++++-------------------- 1 file changed, 418 insertions(+), 353 deletions(-) diff --git a/src/routes/index.jsx b/src/routes/index.jsx index 01740d7..c2a8e2c 100644 --- a/src/routes/index.jsx +++ b/src/routes/index.jsx @@ -76,370 +76,435 @@ import EgovMypageEdit from "@/pages/mypage/EgovMypageEdit"; import initPage from "@/js/ui"; const RootRoutes = () => { - //useLocation객체를 이용하여 정규표현식을 사용한 /admin/~ 으로 시작하는 경로와 비교에 사용(아래 1줄) */} - const location = useLocation(); - - // JWT 토큰 정보 가져오기 함수 추가 - // eslint-disable-next-line no-unused-vars - const [userRole, setUserRole] = useState(""); // 사용자 권한 저장 - - // JWT 토큰에서 사용자 권한 정보 확인 - const getUserRoleFromToken = useCallback(() => { - console.group("getUserRoleFromToken"); - console.log("[Start] getUserRoleFromToken ------------------------------"); - - // 세션에서 JWT 토큰 가져오기 - const token = sessionStorage.getItem("jToken"); - - if (token) { - try { - // JWT 토큰 파싱 (간단한 방식으로 처리) - const tokenParts = token.split("."); - if (tokenParts.length === 3) { - const payload = JSON.parse(atob(tokenParts[1])); - const role = payload.groupNm || ""; - console.log("User role from token:", role); - setUserRole(role); - return role; + //useLocation객체를 이용하여 정규표현식을 사용한 /admin/~ 으로 시작하는 경로와 비교에 사용(아래 1줄) */} + const location = useLocation(); + + // JWT 토큰 정보 가져오기 함수 추가 + // eslint-disable-next-line no-unused-vars + const [userRole, setUserRole] = useState(""); // 사용자 권한 저장 + + // JWT 토큰에서 사용자 권한 정보 확인 + const getUserRoleFromToken = useCallback(() => { + console.group("getUserRoleFromToken"); + console.log( + "[Start] getUserRoleFromToken ------------------------------", + ); + + // 세션에서 JWT 토큰 가져오기 + const token = sessionStorage.getItem("jToken"); + + if (token) { + try { + // JWT 토큰 파싱 (간단한 방식으로 처리) + const tokenParts = token.split("."); + if (tokenParts.length === 3) { + const payload = JSON.parse(atob(tokenParts[1])); + const role = payload.groupNm || ""; + console.log("User role from token:", role); + setUserRole(role); + return role; + } + } catch (error) { + console.error("JWT 토큰 파싱 중 오류:", error); + } } - } catch (error) { - console.error("JWT 토큰 파싱 중 오류:", error); - } - } - console.log("JWT 토큰에서 권한 정보를 찾을 수 없음"); - setUserRole(""); - return ""; - }, []); - - // 경로에 따른 인증 처리를 위한 함수 추가 - const checkPathAccess = useCallback(() => { - console.group("checkPathAccess"); - console.log("[Start] checkPathAccess ------------------------------"); - console.log("Current path:", location.pathname); - - // 현재 경로 가져오기 - const currentPath = location.pathname; - const adminRegex = /^\/admin(\/.*)?$/; - const mypageRegex = /^\/mypage(\/.*)?$/; - - // JWT 토큰에서 사용자 로그인 정보 확인 - const token = sessionStorage.getItem("jToken"); - - if (!token) { - console.log("로그인 정보가 없습니다."); - - // 로그인이 필요한 경로인 경우 처리 - if (adminRegex.test(currentPath) || mypageRegex.test(currentPath)) { - console.log("로그인이 필요한 경로입니다."); - setMounted(false); - alert("로그인이 필요한 경로입니다."); - window.location.href = URL.LOGIN; - return false; - } - - // 로그인이 필요하지 않은 경로인 경우 - setMounted(true); - return true; - } + console.log("JWT 토큰에서 권한 정보를 찾을 수 없음"); + setUserRole(""); + return ""; + }, []); + + // 경로에 따른 인증 처리를 위한 함수 추가 + const checkPathAccess = useCallback(() => { + console.group("checkPathAccess"); + console.log("[Start] checkPathAccess ------------------------------"); + console.log("Current path:", location.pathname); + + // 현재 경로 가져오기 + const currentPath = location.pathname; + const adminRegex = /^\/admin(\/.*)?$/; + const mypageRegex = /^\/mypage(\/.*)?$/; + + // JWT 토큰에서 사용자 로그인 정보 확인 + const token = sessionStorage.getItem("jToken"); + + if (!token) { + console.log("로그인 정보가 없습니다."); + + // 로그인이 필요한 경로인 경우 처리 + if (adminRegex.test(currentPath) || mypageRegex.test(currentPath)) { + console.log("로그인이 필요한 경로입니다."); + setMounted(false); + alert("로그인이 필요한 경로입니다."); + window.location.href = URL.LOGIN; + return false; + } + + // 로그인이 필요하지 않은 경로인 경우 + setMounted(true); + return true; + } - // 사용자 권한 확인 - const role = getUserRoleFromToken(); - console.log("User role:", role); - - // 관리자 페이지 접근 처리 - if (adminRegex.test(currentPath)) { - if (role !== "ROLE_ADMIN") { - console.log("관리자 권한이 없어 접근이 불가합니다."); - setMounted(false); - alert("관리자 권한이 필요한 페이지입니다."); - window.location.href = URL.MAIN; - return false; - } else { - console.log("관리자 권한 확인 성공."); - setMounted(true); - return true; - } - } + // 사용자 권한 확인 + const role = getUserRoleFromToken(); + console.log("User role:", role); + + // 관리자 페이지 접근 처리 + if (adminRegex.test(currentPath)) { + if (role !== "ROLE_ADMIN") { + console.log("관리자 권한이 없어 접근이 불가합니다."); + setMounted(false); + alert("관리자 권한이 필요한 페이지입니다."); + window.location.href = URL.MAIN; + return false; + } else { + console.log("관리자 권한 확인 성공."); + setMounted(true); + return true; + } + } + + // 마이페이지 접근 처리 - 로그인한 유저라면 접근 가능 + if (mypageRegex.test(currentPath)) { + if (!token) { + console.log("로그인이 필요한 경로입니다."); + setMounted(false); + alert("로그인이 필요한 페이지입니다."); + window.location.href = URL.LOGIN; + return false; + } else { + console.log("로그인 사용자 확인 성공."); + setMounted(true); + return true; + } + } - // 마이페이지 접근 처리 - 로그인한 유저라면 접근 가능 - if (mypageRegex.test(currentPath)) { - if (!token) { - console.log("로그인이 필요한 경로입니다."); - setMounted(false); - alert("로그인이 필요한 페이지입니다."); - window.location.href = URL.LOGIN; - return false; - } else { - console.log("로그인 사용자 확인 성공."); + // 기본적으로 모든 다른 경로는 접근 가능 setMounted(true); + console.log("------------------------------checkPathAccess [End]"); + console.groupEnd("checkPathAccess"); return true; - } + }, [getUserRoleFromToken, location.pathname]); + + //시스템관리 메뉴인 /admin/으로 시작하는 URL은 모두 로그인이 필요하도록 코드추가(아래) + const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 + const [mounted, setMounted] = useState(false); // 컴포넌트 최초 마운트 후 리렌더링 전 로그인 페이지로 이동하는 조건으로 사용 + + useEffect(() => { + if (!isMounted.current) { + // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 + isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. + checkPathAccess(); // 경로에 따른 접근 권한 처리 + } else { + // 라우트 변경 시 접근 권한 처리 + checkPathAccess(); + } + }, [checkPathAccess]); // location 경로가 변경 될 때만 업데이트 후 리렌더링 + + if (mounted) { + // 인증 없이 시스템관리 URL로 접근할 때 렌더링 되는 것을 방지하는 조건추가. + return ( + + } /> + } /> + + ); } +}; - // 기본적으로 모든 다른 경로는 접근 가능 - setMounted(true); - console.log("------------------------------checkPathAccess [End]"); - console.groupEnd("checkPathAccess"); - return true; - }, [getUserRoleFromToken, location.pathname]); - - //시스템관리 메뉴인 /admin/으로 시작하는 URL은 모두 로그인이 필요하도록 코드추가(아래) - const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 - const [mounted, setMounted] = useState(false); // 컴포넌트 최초 마운트 후 리렌더링 전 로그인 페이지로 이동하는 조건으로 사용 - - useEffect(() => { - if (!isMounted.current) { - // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 - isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. - checkPathAccess(); // 경로에 따른 접근 권한 처리 - } else { - // 라우트 변경 시 접근 권한 처리 - checkPathAccess(); - } - }, [checkPathAccess]); // location 경로가 변경 될 때만 업데이트 후 리렌더링 +const SecondRoutes = () => { + // eslint-disable-next-line no-unused-vars + const [loginVO, setLoginVO] = useState({}); + + //useRef객체를 사용하여 페이지 마운트 된 후 ui.js를 로딩 하도록 변경 코드 추가(아래) + const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 + + useEffect(() => { + if (!isMounted.current) { + // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 + isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. + } else { + initPage(); + } + }, []); - if (mounted) { - // 인증 없이 시스템관리 URL로 접근할 때 렌더링 되는 것을 방지하는 조건추가. return ( - - } /> - } /> - + <> + + + {/* MAIN */} + } /> + + {/* LOGIN */} + setLoginVO(user)} /> + } + /> + + {/* Sns Naver Callback */} + setLoginVO(user)} + /> + } + /> + {/* Sns Kakao Callback */} + setLoginVO(user)} + /> + } + /> + + {/* ERROR */} + } /> + + {/* ABOUT */} + } + /> + } /> + } + /> + } + /> + } + /> + + {/* INTRO */} + } + /> + } /> + } + /> + + {/* SUPPORT */} + } + /> + + } + /> + } + /> + } + /> + + } + /> + } + /> + + } + /> + + {/* INFORM */} + } + /> + + } /> + } + /> + } /> + } + /> + + } /> + } + /> + } + /> + } + /> + } + /> + + } + /> + } + /> + } + /> + } + /> + } + /> + + {/* ADMIN */} + } + /> + } + /> + } + /> + } + /> + } + /> + + } + /> + } + /> + } + /> + + } + /> + } + /> + } + /> + + } + /> + } + /> + } + /> + } + /> + } + /> + + } + /> + } + /> + } + /> + } + /> + } + /> + {/* 사이트관리자 암호 바꾸기 기능 */} + } + /> + } + /> + } + /> + } + /> + {/* MYPAGE */} + } + /> + } + /> + + + + + ); - } -}; - -const SecondRoutes = () => { - // eslint-disable-next-line no-unused-vars - const [loginVO, setLoginVO] = useState({}); - - //useRef객체를 사용하여 페이지 마운트 된 후 ui.js를 로딩 하도록 변경 코드 추가(아래) - const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 - - useEffect(() => { - if (!isMounted.current) { - // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 - isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. - } else { - initPage(); - } - }, []); - - return ( - <> - - - {/* MAIN */} - } /> - - {/* LOGIN */} - setLoginVO(user)} />} - /> - - {/* Sns Naver Callback */} - setLoginVO(user)} /> - } - /> - {/* Sns Kakao Callback */} - setLoginVO(user)} /> - } - /> - - {/* ERROR */} - } /> - - {/* ABOUT */} - } /> - } /> - } /> - } - /> - } /> - - {/* INTRO */} - } /> - } /> - } /> - - {/* SUPPORT */} - } - /> - - } - /> - } - /> - } - /> - - } /> - } - /> - - } /> - - {/* INFORM */} - } /> - - } /> - } /> - } /> - } /> - - } /> - } /> - } - /> - } - /> - } - /> - - } /> - } - /> - } - /> - } - /> - } - /> - - {/* ADMIN */} - } - /> - } /> - } - /> - } - /> - } - /> - - } /> - } - /> - } - /> - - } /> - } - /> - } - /> - - } /> - } - /> - } - /> - } - /> - } - /> - - } /> - } - /> - } - /> - } - /> - } - /> - {/* 사이트관리자 암호 바꾸기 기능 */} - } /> - } /> - } - /> - } - /> - {/* MYPAGE */} - } - /> - } - /> - - - - - - ); }; export default RootRoutes; From 319451a1f4efcb9407070a8b956b0b8286c59314 Mon Sep 17 00:00:00 2001 From: lukatheleopard Date: Thu, 28 Aug 2025 09:32:32 +0900 Subject: [PATCH 2/2] =?UTF-8?q?Fix(Router):=20=EB=B8=8C=EB=9D=BC=EC=9A=B0?= =?UTF-8?q?=EC=A0=80=20=EB=92=A4=EB=A1=9C=EA=B0=80=EA=B8=B0=20=EB=AC=B8?= =?UTF-8?q?=EC=A0=9C=20=EC=88=98=EC=A0=95=20=EB=B0=8F=20=ED=8F=AC=EB=A7=B7?= =?UTF-8?q?=ED=8C=85=20=EC=A0=95=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/routes/index.jsx | 773 ++++++++++++++++++++----------------------- 1 file changed, 354 insertions(+), 419 deletions(-) diff --git a/src/routes/index.jsx b/src/routes/index.jsx index c2a8e2c..ac31901 100644 --- a/src/routes/index.jsx +++ b/src/routes/index.jsx @@ -76,435 +76,370 @@ import EgovMypageEdit from "@/pages/mypage/EgovMypageEdit"; import initPage from "@/js/ui"; const RootRoutes = () => { - //useLocation객체를 이용하여 정규표현식을 사용한 /admin/~ 으로 시작하는 경로와 비교에 사용(아래 1줄) */} - const location = useLocation(); - - // JWT 토큰 정보 가져오기 함수 추가 - // eslint-disable-next-line no-unused-vars - const [userRole, setUserRole] = useState(""); // 사용자 권한 저장 - - // JWT 토큰에서 사용자 권한 정보 확인 - const getUserRoleFromToken = useCallback(() => { - console.group("getUserRoleFromToken"); - console.log( - "[Start] getUserRoleFromToken ------------------------------", - ); - - // 세션에서 JWT 토큰 가져오기 - const token = sessionStorage.getItem("jToken"); - - if (token) { - try { - // JWT 토큰 파싱 (간단한 방식으로 처리) - const tokenParts = token.split("."); - if (tokenParts.length === 3) { - const payload = JSON.parse(atob(tokenParts[1])); - const role = payload.groupNm || ""; - console.log("User role from token:", role); - setUserRole(role); - return role; - } - } catch (error) { - console.error("JWT 토큰 파싱 중 오류:", error); - } - } - - console.log("JWT 토큰에서 권한 정보를 찾을 수 없음"); - setUserRole(""); - return ""; - }, []); - - // 경로에 따른 인증 처리를 위한 함수 추가 - const checkPathAccess = useCallback(() => { - console.group("checkPathAccess"); - console.log("[Start] checkPathAccess ------------------------------"); - console.log("Current path:", location.pathname); - - // 현재 경로 가져오기 - const currentPath = location.pathname; - const adminRegex = /^\/admin(\/.*)?$/; - const mypageRegex = /^\/mypage(\/.*)?$/; - - // JWT 토큰에서 사용자 로그인 정보 확인 - const token = sessionStorage.getItem("jToken"); - - if (!token) { - console.log("로그인 정보가 없습니다."); - - // 로그인이 필요한 경로인 경우 처리 - if (adminRegex.test(currentPath) || mypageRegex.test(currentPath)) { - console.log("로그인이 필요한 경로입니다."); - setMounted(false); - alert("로그인이 필요한 경로입니다."); - window.location.href = URL.LOGIN; - return false; - } - - // 로그인이 필요하지 않은 경로인 경우 - setMounted(true); - return true; + //useLocation객체를 이용하여 정규표현식을 사용한 /admin/~ 으로 시작하는 경로와 비교에 사용(아래 1줄) */} + const location = useLocation(); + + // JWT 토큰 정보 가져오기 함수 추가 + // eslint-disable-next-line no-unused-vars + const [userRole, setUserRole] = useState(""); // 사용자 권한 저장 + + // JWT 토큰에서 사용자 권한 정보 확인 + const getUserRoleFromToken = useCallback(() => { + console.group("getUserRoleFromToken"); + console.log("[Start] getUserRoleFromToken ------------------------------"); + + // 세션에서 JWT 토큰 가져오기 + const token = sessionStorage.getItem("jToken"); + + if (token) { + try { + // JWT 토큰 파싱 (간단한 방식으로 처리) + const tokenParts = token.split("."); + if (tokenParts.length === 3) { + const payload = JSON.parse(atob(tokenParts[1])); + const role = payload.groupNm || ""; + console.log("User role from token:", role); + setUserRole(role); + return role; } + } catch (error) { + console.error("JWT 토큰 파싱 중 오류:", error); + } + } - // 사용자 권한 확인 - const role = getUserRoleFromToken(); - console.log("User role:", role); - - // 관리자 페이지 접근 처리 - if (adminRegex.test(currentPath)) { - if (role !== "ROLE_ADMIN") { - console.log("관리자 권한이 없어 접근이 불가합니다."); - setMounted(false); - alert("관리자 권한이 필요한 페이지입니다."); - window.location.href = URL.MAIN; - return false; - } else { - console.log("관리자 권한 확인 성공."); - setMounted(true); - return true; - } - } + console.log("JWT 토큰에서 권한 정보를 찾을 수 없음"); + setUserRole(""); + return ""; + }, []); + + // 경로에 따른 인증 처리를 위한 함수 추가 + const checkPathAccess = useCallback(() => { + console.group("checkPathAccess"); + console.log("[Start] checkPathAccess ------------------------------"); + console.log("Current path:", location.pathname); + + // 현재 경로 가져오기 + const currentPath = location.pathname; + const adminRegex = /^\/admin(\/.*)?$/; + const mypageRegex = /^\/mypage(\/.*)?$/; + + // JWT 토큰에서 사용자 로그인 정보 확인 + const token = sessionStorage.getItem("jToken"); + + if (!token) { + console.log("로그인 정보가 없습니다."); + + // 로그인이 필요한 경로인 경우 처리 + if (adminRegex.test(currentPath) || mypageRegex.test(currentPath)) { + console.log("로그인이 필요한 경로입니다."); + setMounted(false); + alert("로그인이 필요한 경로입니다."); + window.location.href = URL.LOGIN; + return false; + } + + // 로그인이 필요하지 않은 경로인 경우 + setMounted(true); + return true; + } - // 마이페이지 접근 처리 - 로그인한 유저라면 접근 가능 - if (mypageRegex.test(currentPath)) { - if (!token) { - console.log("로그인이 필요한 경로입니다."); - setMounted(false); - alert("로그인이 필요한 페이지입니다."); - window.location.href = URL.LOGIN; - return false; - } else { - console.log("로그인 사용자 확인 성공."); - setMounted(true); - return true; - } - } + // 사용자 권한 확인 + const role = getUserRoleFromToken(); + console.log("User role:", role); + + // 관리자 페이지 접근 처리 + if (adminRegex.test(currentPath)) { + if (role !== "ROLE_ADMIN") { + console.log("관리자 권한이 없어 접근이 불가합니다."); + setMounted(false); + alert("관리자 권한이 필요한 페이지입니다."); + window.location.href = URL.MAIN; + return false; + } else { + console.log("관리자 권한 확인 성공."); + setMounted(true); + return true; + } + } - // 기본적으로 모든 다른 경로는 접근 가능 + // 마이페이지 접근 처리 - 로그인한 유저라면 접근 가능 + if (mypageRegex.test(currentPath)) { + if (!token) { + console.log("로그인이 필요한 경로입니다."); + setMounted(false); + alert("로그인이 필요한 페이지입니다."); + window.location.href = URL.LOGIN; + return false; + } else { + console.log("로그인 사용자 확인 성공."); setMounted(true); - console.log("------------------------------checkPathAccess [End]"); - console.groupEnd("checkPathAccess"); return true; - }, [getUserRoleFromToken, location.pathname]); - - //시스템관리 메뉴인 /admin/으로 시작하는 URL은 모두 로그인이 필요하도록 코드추가(아래) - const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 - const [mounted, setMounted] = useState(false); // 컴포넌트 최초 마운트 후 리렌더링 전 로그인 페이지로 이동하는 조건으로 사용 - - useEffect(() => { - if (!isMounted.current) { - // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 - isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. - checkPathAccess(); // 경로에 따른 접근 권한 처리 - } else { - // 라우트 변경 시 접근 권한 처리 - checkPathAccess(); - } - }, [checkPathAccess]); // location 경로가 변경 될 때만 업데이트 후 리렌더링 - - if (mounted) { - // 인증 없이 시스템관리 URL로 접근할 때 렌더링 되는 것을 방지하는 조건추가. - return ( - - } /> - } /> - - ); + } } -}; -const SecondRoutes = () => { - // eslint-disable-next-line no-unused-vars - const [loginVO, setLoginVO] = useState({}); - - //useRef객체를 사용하여 페이지 마운트 된 후 ui.js를 로딩 하도록 변경 코드 추가(아래) - const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 - - useEffect(() => { - if (!isMounted.current) { - // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 - isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. - } else { - initPage(); - } - }, []); + // 기본적으로 모든 다른 경로는 접근 가능 + setMounted(true); + console.log("------------------------------checkPathAccess [End]"); + console.groupEnd("checkPathAccess"); + return true; + }, [getUserRoleFromToken, location.pathname]); + + //시스템관리 메뉴인 /admin/으로 시작하는 URL은 모두 로그인이 필요하도록 코드추가(아래) + const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 + const [mounted, setMounted] = useState(false); // 컴포넌트 최초 마운트 후 리렌더링 전 로그인 페이지로 이동하는 조건으로 사용 + + useEffect(() => { + if (!isMounted.current) { + // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 + isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. + checkPathAccess(); // 경로에 따른 접근 권한 처리 + } else { + // 라우트 변경 시 접근 권한 처리 + checkPathAccess(); + } + }, [checkPathAccess]); // location 경로가 변경 될 때만 업데이트 후 리렌더링 + if (mounted) { + // 인증 없이 시스템관리 URL로 접근할 때 렌더링 되는 것을 방지하는 조건추가. return ( - <> - - - {/* MAIN */} - } /> - - {/* LOGIN */} - setLoginVO(user)} /> - } - /> - - {/* Sns Naver Callback */} - setLoginVO(user)} - /> - } - /> - {/* Sns Kakao Callback */} - setLoginVO(user)} - /> - } - /> - - {/* ERROR */} - } /> - - {/* ABOUT */} - } - /> - } /> - } - /> - } - /> - } - /> - - {/* INTRO */} - } - /> - } /> - } - /> - - {/* SUPPORT */} - } - /> - - } - /> - } - /> - } - /> - - } - /> - } - /> - - } - /> - - {/* INFORM */} - } - /> - - } /> - } - /> - } /> - } - /> - - } /> - } - /> - } - /> - } - /> - } - /> - - } - /> - } - /> - } - /> - } - /> - } - /> - - {/* ADMIN */} - } - /> - } - /> - } - /> - } - /> - } - /> - - } - /> - } - /> - } - /> - - } - /> - } - /> - } - /> - - } - /> - } - /> - } - /> - } - /> - } - /> - - } - /> - } - /> - } - /> - } - /> - } - /> - {/* 사이트관리자 암호 바꾸기 기능 */} - } - /> - } - /> - } - /> - } - /> - {/* MYPAGE */} - } - /> - } - /> - - - - - + + } /> + } /> + ); + } +}; + +const SecondRoutes = () => { + // eslint-disable-next-line no-unused-vars + const [loginVO, setLoginVO] = useState({}); + + //useRef객체를 사용하여 페이지 마운트 된 후 ui.js를 로딩 하도록 변경 코드 추가(아래) + const isMounted = useRef(false); // 아래 로그인 이동 부분이 2번 실행되지 않도록 즉, 마운트 될 때만 실행되도록 변수 생성 + + useEffect(() => { + if (!isMounted.current) { + // 컴포넌트 최초 마운트 시 페이지 진입 전(렌더링 전) 실행 + isMounted.current = true; // 이 값으로 true 일 때만 페이지를 렌더링이 되는 변수 사용. + } else { + initPage(); + } + }, []); + + return ( + <> + + + {/* MAIN */} + } /> + + {/* LOGIN */} + setLoginVO(user)} />} + /> + + {/* Sns Naver Callback */} + setLoginVO(user)} /> + } + /> + {/* Sns Kakao Callback */} + setLoginVO(user)} /> + } + /> + + {/* ERROR */} + } /> + + {/* ABOUT */} + } /> + } /> + } /> + } + /> + } /> + + {/* INTRO */} + } /> + } /> + } /> + + {/* SUPPORT */} + } + /> + + } + /> + } + /> + } + /> + + } /> + } + /> + + } /> + + {/* INFORM */} + } /> + + } /> + } /> + } /> + } /> + + } /> + } /> + } + /> + } + /> + } + /> + + } /> + } + /> + } + /> + } + /> + } + /> + + {/* ADMIN */} + } + /> + } /> + } + /> + } + /> + } + /> + + } /> + } + /> + } + /> + + } /> + } + /> + } + /> + + } /> + } + /> + } + /> + } + /> + } + /> + + } /> + } + /> + } + /> + } + /> + } + /> + {/* 사이트관리자 암호 바꾸기 기능 */} + } /> + } /> + } + /> + } + /> + {/* MYPAGE */} + } + /> + } + /> + + + + + + ); }; -export default RootRoutes; +export default RootRoutes; \ No newline at end of file