/** * @author : 최정우 * @since : 2022.09.20 * @dscription : React를 활용한 Client단 구현 대상인 Application의 시작점(Index) Component 입니다. */ import React from "react"; import { useSelector, useDispatch } from "react-redux"; import { useLocation, /* useNavigate */ } from "react-router"; //Application의 전역 상태값(변수) 저장소(Store) 관리 Component import { setLoginUser, setSeniorList, setCurrentSeniorIndex } from "./AppStore.jsx"; //Application의 Route 정보를 관리하는 Component import { AdminApp, GovernmentApp, AgencyApp, AgencyAdminApp, GuardianApp } from "./AppRoute.jsx"; //Test Layout import Header from "../layout/Header.jsx"; import Menu from "../layout/Menu.jsx"; import Login from "./login/Login.jsx"; import PasswordChange from "./main/PasswordChange.jsx"; import Weather from "./main/Weather.jsx"; import CommonUtil from "../../resources/js/CommonUtil.js"; /**************** Firebase 푸시 설정 (시작) ****************/ //Firebase 푸시 설정 모듈 import { initializeApp } from "firebase/app"; import { getAnalytics } from "firebase/analytics"; import { getMessaging, getToken, onMessage, onBackgroundMessage } from "firebase/messaging"; //Firebase 인증 키 const firebaseConfig = { apiKey: "AIzaSyC7ir2BiRRIUYdwrfQVbzCIP7-nrOV1hIg", authDomain: "senior-care-system-7723e.firebaseapp.com", projectId: "senior-care-system-7723e", storageBucket: "senior-care-system-7723e.appspot.com", messagingSenderId: "687439442500", appId: "1:687439442500:web:caf4f935a8deb0fee0c211", measurementId: "G-0E4G93904K" }; // Initialize Firebase const firebaseApp = initializeApp(firebaseConfig); const analytics = getAnalytics(firebaseApp); /**************** Firebase 푸시 설정 (종료) ****************/ function App() { /**************** Firebase 푸시 설정 (시작) ****************/ const messaging = getMessaging(); onMessage(messaging, (payload) => { console.log('Message received. ', payload); }); /* onBackgroundMessage(messaging, (payload) => { console.log('Message received. ', payload); }); */ const [token, setToken] = React.useState(null); const requestToken = (loginUser) => { if (!window.Notification) { console.log('[requestToken()] 푸쉬 알람을 지원하지 않는 브라우저라, 푸쉬 토큰을 가지고오지 않습니다.'); } else { if (Notification.permission == "granted") { getToken(messaging, { vapidKey: 'BCVKYse4XZVC_IZHOBdq99RtUVHDtOwaPSv2tK3NNaJve2f-UTqmqOfQuJ-eZZbHDuPPeJyeStJtFjlACqtwz8s' }).then((currentToken) => { console.log('currentToken : ', currentToken); if (currentToken) { setToken(currentToken); if (CommonUtil.isEmpty(loginUser) == false && (CommonUtil.isEmpty(loginUser['push_token']) || loginUser['push_token'] != currentToken)) { loginUser['push_token'] = currentToken userUpdateForPushToken(loginUser); } /* navigator.clipboard.writeText(currentToken).then(() => { console.log("Text copied to clipboard... : ", currentToken); }).catch(err => { console.log('Something went wrong', err); }); */ } else { // Show permission request UI console.log('No registration token available. Request permission to generate one.'); // ... } }).catch((err) => { console.log('Firebase getToken Error ', err); }); } else { console.log('[requestToken()] 푸쉬 알람을 권한 : ', Notification.permission); } } } const [isPush, setIsPush] = React.useState(null); const requestPermission = (loginUser) => { try { if (!window.Notification) { alert('푸쉬 알람을 지원하지 않는 브라우저입니다.'); } else { Notification.requestPermission().then((permission) => { console.log('permission : ', permission); if (permission == "granted") { setIsPush(true); // FCM 메세지 처리 if (CommonUtil.isEmpty(loginUser) == false && (CommonUtil.isEmpty(loginUser['is_push']) || loginUser['is_push'] == false)) { loginUser['is_push'] = true; userUpdateForIsPush(loginUser); } } else { setIsPush(false); if (CommonUtil.isEmpty(loginUser) == false && (CommonUtil.isEmpty(loginUser['is_push']) || loginUser['is_push'] == true)) { loginUser['is_push'] = false; userUpdateForIsPush(loginUser); } } }); } } catch (e) { console.error(e); } } /**************** Firebase 푸시 설정 (종료) ****************/ const location = useLocation(); //const navigate = useNavigate(); //전역 변수 저장 객체 const state = useSelector((state) => { return state }); const dispatch = useDispatch(); //로그인 여부 const [isLogin, setIsLogin] = React.useState(false); //기본 비밀번호 사용 여부 확인 (로그인 여부 확인 후, 사용 바람) const [isDefaultPassword, setIsDefaultPassword] = React.useState(false); //로그인에 따라 각기 다른 App 주입 대상 변수(AdminApp, GovernmentApp, AgencyApp, GuardianApp) const [appRoute, setAppRoute] = React.useState(null); const [menuItems, setMenuItems] = React.useState(null); //로그인 사용자 조회 const loginUserSelectOne = (clientLoginCheck) => { fetch("/user/loginUserSelectOne.json", { method: "POST", headers: { 'Content-Type': 'application/json; charset=UTF-8' }, body: JSON.stringify({}), }).then((response) => response.json()).then((loginUser) => { console.log("로그인 결과 : ", loginUser); //로그인 사용자 정보 전역 변수에 저장 // dispatch(setLoginUser(loginUser)); if (loginUser) { if (loginUser['government_type'] == 'HOSPITAL') { loginUser['title_name'] = '의료사회복지사' } else { loginUser['title_name'] = '생활지원사' } dispatch(setLoginUser(loginUser)); } //로그인 유무(로그인 정보가 있으면 True, 없으면 False) let isLogin = (loginUser != null && loginUser['user_id'] != null); setIsLogin(isLogin); //기본 비밀번호 사용 여부 확인 fetch("/user/isDefaultPassword.json", { method: "POST", headers: { 'Content-Type': 'application/json; charset=UTF-8' }, body: JSON.stringify({}), }).then((response) => response.json()).then((isDefaultPassword) => { console.log("기본 비밀번호 사용 여부 확인 결과 : ", isDefaultPassword); setIsDefaultPassword(isDefaultPassword); //클라이언트 로그인 체크 (콜백) if (CommonUtil.isEmpty(clientLoginCheck) == false) { clientLoginCheck(loginUser, isLogin); } }).catch((error) => { console.log('login() /user/isDefaultPassword.json error : ', error); }); }).catch((error) => { console.log('login() /user/loginUserSelectOne.json error : ', error); }); }; //사용자 수정 (푸시 알림 여부) const userUpdateForIsPush = (loginUser) => { fetch("/user/userUpdateForIsPush.json", { method: "POST", headers: { 'Content-Type': 'application/json; charset=UTF-8' }, body: JSON.stringify(loginUser), }).then((response) => response.json()).then((data) => { console.log("사용자 수정 (푸시 알림 여부) : ", data); loginUserSelectOne(); }).catch((error) => { console.log('login() /user/userUpdateForIsPush.json error : ', error); }); }; //사용자 수정 (푸시 알림 토큰) const userUpdateForPushToken = (loginUser) => { fetch("/user/userUpdateForPushToken.json", { method: "POST", headers: { 'Content-Type': 'application/json; charset=UTF-8' }, body: JSON.stringify(loginUser), }).then((response) => response.json()).then((data) => { console.log("사용자 수정 (푸시 알림 토큰) : ", data); loginUserSelectOne(); }).catch((error) => { console.log('login() /user/userUpdateForPushToken.json error : ', error); }); }; //특정 보호자의 대상자(시니어) 목록 조회 const seniorSelectListByGuardian = (loginUser) => { fetch("/user/seniorSelectListByGuardian.json", { method: "POST", headers: { 'Content-Type': 'application/json; charset=UTF-8' }, body: JSON.stringify({ 'guardian_id': loginUser['user_id'] }), }).then((response) => response.json()).then((data) => { console.log("특정 보호자의 대상자(시니어) 목록 조회 : ", data); //로그인 사용자 정보 전역 변수에 저장 dispatch(setSeniorList({ value: data })); }).catch((error) => { console.log('login() /user/seniorSelectListByGuardian.json error : ', error); }); }; //URL 변경 시, 발생 이벤트(hook) React.useEffect(() => { loginUserSelectOne((loginResultData, isLogin) => { //console.log('loginResultData : ', loginResultData); //console.log('isLogin : ', isLogin, ', authority : ', loginResultData['authority']); //사용자 정보 조회 fetch("/user/userSelectOne.json", { method: "POST", headers: { 'Content-Type': 'application/json; charset=UTF-8' }, body: JSON.stringify(loginResultData), }).then((response) => response.json()).then((data) => { dispatch(setLoginUser(data)); }).catch((error) => { console.log('loginUserSelectOne() userSelectOne() /user/userSelectOne.json error : ', error); }); //로그인 -> 권한에 따른 App 주입 if (isLogin == true) { if (loginResultData['authority'] == 'ROLE_ADMIN') { setMenuItems(AdminApp.menuItems); setAppRoute(); } else if (loginResultData['authority'] == 'ROLE_GOVERNMENT') { setMenuItems(GovernmentApp.menuItems); setAppRoute(); } else if (loginResultData['authority'] == 'ROLE_AGENCYADMIN') { setMenuItems(AgencyAdminApp.menuItems); setAppRoute(); } else if (loginResultData['authority'] == 'ROLE_AGENCY') { setMenuItems(AgencyApp.menuItems); setAppRoute(); } else if (loginResultData['authority'] == 'ROLE_GUARDIAN' || loginResultData['authority'] == 'ROLE_SENIOR') { setMenuItems(GuardianApp.menuItems); setAppRoute(); if (loginResultData['authority'] == 'ROLE_GUARDIAN' && CommonUtil.isEmpty(state['seniorList'].value) == true) { seniorSelectListByGuardian(loginResultData); } } else { alert('권한 관련 에러 - 관리자에게 문의바랍니다.'); console.log('권한 관련 에러 - 관리자에게 문의바랍니다 : ', loginResultData); } if (CommonUtil.isEmpty(isPush)) { requestPermission(loginResultData); } if (CommonUtil.isEmpty(token)) { requestToken(loginResultData); } } else { setIsPush(null); setToken(null); dispatch(setLoginUser({})); dispatch(setSeniorList({ value: [] })); dispatch(setCurrentSeniorIndex({ value: 0 })); } }); }, [location]); return (
{isLogin == true ? isDefaultPassword == false ? (
{appRoute != null ? appRoute : null}
) : () : ()}
); } export default App;