diff --git a/src/@core/layouts/components/navbar/UserDropdown.js b/src/@core/layouts/components/navbar/UserDropdown.js
index 9df35052..ab7d1225 100644
--- a/src/@core/layouts/components/navbar/UserDropdown.js
+++ b/src/@core/layouts/components/navbar/UserDropdown.js
@@ -18,15 +18,26 @@ import {
UncontrolledDropdown
} from '@component/ui';
import { setLogout } from '@src/_redux/features/account/auth/authThunk';
+import {
+ COOKIE_ACCESS_TOKEN,
+ COOKIE_REFRESH_TOKEN,
+ cookieStorage
+} from '@src/modules/account/auth/service/cookie';
const UserDropdown = () => {
// ** Store Vars
const dispatch = useDispatch();
const history = useHistory();
- const { isLogin, user } = useSelector(state => state.authState);
+ const { user } = useSelector(state => state.authState);
const handelrLogout = async () => {
- dispatch(setLogout());
+ const { payload } = await dispatch(setLogout());
+ console.log(payload);
+ if (payload === 'SUCCESS') {
+ cookieStorage.removeCookie(COOKIE_ACCESS_TOKEN);
+ cookieStorage.removeCookie(COOKIE_REFRESH_TOKEN);
+ history.push('/account/login');
+ }
};
// useEffect(() => {
diff --git a/src/_redux/features/account/auth/authThunk.ts b/src/_redux/features/account/auth/authThunk.ts
index 3c4c75bb..9a405b8e 100644
--- a/src/_redux/features/account/auth/authThunk.ts
+++ b/src/_redux/features/account/auth/authThunk.ts
@@ -48,11 +48,7 @@ export const setLogin = createAsyncThunk(
cookieStorage.setCookie(COOKIE_ACCESS_TOKEN, data.accessToken);
cookieStorage.setCookie(COOKIE_REFRESH_TOKEN, data.refreshToken);
- const { data: user }: { data: ICheckAuthencationRs } = await axios.get(
- `api/acnt/jwt/profile/${data.cstmrSno}`
- );
-
- return user;
+ thunkAPI.dispatch(checkCookie());
} catch (error) {
thunkAPI.dispatch(
openModal({
@@ -109,14 +105,8 @@ export const setLogout = createAsyncThunk(
`api/acnt/jwt/logout/${decodedToken.cstmrSno}`
);
- if (data === 'SUCCESS') location.href = '/account/login';
+ return data;
}
-
- cookieStorage.removeCookie(COOKIE_ACCESS_TOKEN);
- cookieStorage.removeCookie(COOKIE_REFRESH_TOKEN);
-
- // yield put(replace('/'));
- location.href = '/';
} catch (error) {
thunkAPI.dispatch(
openModal({
@@ -287,3 +277,25 @@ export const updateUserPw = createAsyncThunk(
}
}
);
+
+export const checkToken = createAsyncThunk(
+ 'account/checkToken',
+ async (_, thunkAPI) => {
+ try {
+ const { data }: { data: boolean } = await axios.get(
+ '/api/acnt/jwt/valid/token'
+ );
+ thunkAPI.dispatch(checkCookie());
+ return data;
+ } catch (error) {
+ thunkAPI.dispatch(
+ openModal({
+ errorCode: ERROR_MESSAGE.code,
+ errorMessage: ERROR_MESSAGE.message,
+ isHistoryBack: false,
+ isRefresh: false
+ })
+ );
+ }
+ }
+);
diff --git a/src/components/account/login/AccountLogin.js b/src/components/account/login/AccountLogin.js
index bb6c8147..fb359271 100644
--- a/src/components/account/login/AccountLogin.js
+++ b/src/components/account/login/AccountLogin.js
@@ -15,12 +15,9 @@ import kacLogo from '../../../assets/images/logo/kac_logo.svg';
import { setLogin } from '@src/_redux/features/account/auth/authThunk';
import { openModal } from '@src/_redux/features/comn/message/messageSlice';
-export const AccountLogin = ({ props }) => {
+export const AccountLogin = ({ history }) => {
const dispatch = useDispatch();
- // 로그인 결과
- const { isLogin } = useSelector(state => state.authState);
-
// 로그인 폼
const [loginForm, setLoginForm] = useState({
userId: '',
@@ -47,7 +44,7 @@ export const AccountLogin = ({ props }) => {
};
// 로그인 유효성검사 핸들러
- const handelrLogin = () => {
+ const handelrLogin = async () => {
if (!loginForm.userId) {
dispatch(
openModal({
@@ -66,16 +63,13 @@ export const AccountLogin = ({ props }) => {
return;
}
- dispatch(setLogin(loginForm));
+ const { meta } = await dispatch(setLogin(loginForm));
+ console.log(meta);
+ if (meta.requestStatus === 'fulfilled') {
+ history.push('/control');
+ }
};
- // 로그인 성공시 메인화면으로 이동
- useEffect(() => {
- if (isLogin) {
- // LANCC 화면으로 이동
- props.history.replace('/control');
- }
- }, [isLogin]);
return (
<>
@@ -106,7 +100,6 @@ export const AccountLogin = ({ props }) => {
placeholder='ID'
name='userId'
value={loginForm.userId}
- onKeyPress={onKeyPress}
onChange={handelrChange}
/>
@@ -123,13 +116,16 @@ export const AccountLogin = ({ props }) => {
type='password'
name='userPswd'
value={loginForm.userPswd}
- onKeyPress={onKeyPress}
onChange={handelrChange}
/>
-
diff --git a/src/containers/basis/dron/BasisDronContainer.js b/src/containers/basis/dron/BasisDronContainer.js
index 95efce53..b83c3b16 100644
--- a/src/containers/basis/dron/BasisDronContainer.js
+++ b/src/containers/basis/dron/BasisDronContainer.js
@@ -17,18 +17,15 @@ import {
getJoinGroupList
} from '@src/_redux/features/basis/group/groupThunk';
-export const BasisDronContainer = props => {
+export const BasisDronContainer = ({ history, user }) => {
const dispatch = useDispatch();
- const history = useHistory();
-
// 기체 목록, 총 기체 수, 현재 활성화한 그룹 정보
const { droneList, droneTotal, selectGroup } = useSelector(
state => state.droneState
);
// 유저 정보
- const { user } = useSelector(state => state.authState, shallowEqual);
const [params, setParams] = useState({});
const titleName = '기체 관리';
diff --git a/src/containers/basis/group/BasisGroupApprovalContainer.js b/src/containers/basis/group/BasisGroupApprovalContainer.js
index 09c8b266..b9bcd613 100644
--- a/src/containers/basis/group/BasisGroupApprovalContainer.js
+++ b/src/containers/basis/group/BasisGroupApprovalContainer.js
@@ -14,13 +14,10 @@ import {
} from '@src/_redux/features/basis/group/groupThunk';
import { clientSelectAprvGroup } from '@src/_redux/features/basis/group/groupSlice';
-export const BasisGroupApprovalContainer = props => {
+export const BasisGroupApprovalContainer = ({ user }) => {
const dispatch = useDispatch();
const titleName = '승인관리';
- // 유저 정보
- const { user } = useSelector(state => state.authState);
-
// 검색 조건 초기값
const [params, setParams] = useState({
cstmrSno: user?.cstmrSno,
diff --git a/src/containers/basis/group/BasisGroupContainer.js b/src/containers/basis/group/BasisGroupContainer.js
index ae75d2d5..3ca42482 100644
--- a/src/containers/basis/group/BasisGroupContainer.js
+++ b/src/containers/basis/group/BasisGroupContainer.js
@@ -12,9 +12,9 @@ import {
leaveGroup
} from '@src/_redux/features/basis/group/groupThunk';
-export const BasisGroupContainer = props => {
+export const BasisGroupContainer = ({ history, user }) => {
const dispatch = useDispatch();
- const history = useHistory();
+
const titleName = '나의 그룹';
const [saveParams, setSaveParams] = useState({});
@@ -23,9 +23,6 @@ export const BasisGroupContainer = props => {
state => state.groupState
);
- // 유저 정보
- const { user } = useSelector(state => state.authState);
-
//모달 관련 설정
const [modal, setModal] = useState({
isOpen: false,
diff --git a/src/containers/basis/group/BasisGroupDetailContainer.js b/src/containers/basis/group/BasisGroupDetailContainer.js
index 77714701..906bf76a 100644
--- a/src/containers/basis/group/BasisGroupDetailContainer.js
+++ b/src/containers/basis/group/BasisGroupDetailContainer.js
@@ -12,7 +12,7 @@ import {
updateGroup
} from '@src/_redux/features/basis/group/groupThunk';
-export const BasisGroupDetailContainer = () => {
+export const BasisGroupDetailContainer = ({ user }) => {
const dispatch = useDispatch();
const { id } = useParams();
@@ -21,9 +21,6 @@ export const BasisGroupDetailContainer = () => {
// 그룹 상세정보, 그룹 랜덤 ID
const { groupDetail, newGroupId } = useSelector(state => state.groupState);
- // 유저 정보
- const { user } = useSelector(state => state.authState);
-
// 그룹 초기 데이터
const [groupData, setGroupData] = useState({
type: 'create',
diff --git a/src/containers/basis/group/BasisGroupDetailJoinContainer.js b/src/containers/basis/group/BasisGroupDetailJoinContainer.js
index 08fd3d3b..3ae11cb2 100644
--- a/src/containers/basis/group/BasisGroupDetailJoinContainer.js
+++ b/src/containers/basis/group/BasisGroupDetailJoinContainer.js
@@ -10,13 +10,10 @@ import {
joinGroup
} from '@src/_redux/features/basis/group/groupThunk';
-export const BasisGroupDetailJoinContainer = props => {
+export const BasisGroupDetailJoinContainer = ({ user }) => {
const dispatch = useDispatch();
const titleName = '그룹가입';
- // 유저 정보
- const { user } = useSelector(state => state.authState);
-
// 그룹가입목록, 그룹가입목록 수
const { joinList, joinListCount } = useSelector(state => state.groupState);
diff --git a/src/containers/basis/group/BasisGroupUsersContainer.js b/src/containers/basis/group/BasisGroupUsersContainer.js
index 74dd234f..8ce7ec15 100644
--- a/src/containers/basis/group/BasisGroupUsersContainer.js
+++ b/src/containers/basis/group/BasisGroupUsersContainer.js
@@ -15,7 +15,7 @@ import {
} from '@src/_redux/features/basis/group/groupThunk';
import { clientSelectUserGroup } from '@src/_redux/features/basis/group/groupSlice';
-export const BasisGroupUsersContainer = props => {
+export const BasisGroupUsersContainer = ({ user }) => {
const dispatch = useDispatch();
const titleName = '사용자 관리';
@@ -30,9 +30,6 @@ export const BasisGroupUsersContainer = props => {
count
} = useSelector(state => state.groupState);
- // 유저 정보
- const { user } = useSelector(state => state.authState);
-
/**
* 검색 조건 초기값
* cstmrSno: 유저고유번호
diff --git a/src/containers/main/dash/MainDashContainer.js b/src/containers/main/dash/MainDashContainer.js
index a5370519..45856196 100644
--- a/src/containers/main/dash/MainDashContainer.js
+++ b/src/containers/main/dash/MainDashContainer.js
@@ -10,7 +10,7 @@ import { DashboardStcsDay } from '../../../components/dashboard/DashboardStcsDay
import * as Actions from '../../../_redux/features/dashboard/dashboardThunk';
import { MessageErrorModal } from '../../../components/message/MessageErrorModal';
-export const MainDashContainer = () => {
+export const MainDashContainer = ({ history, user }) => {
const dispatch = useDispatch();
/*
stcsDayList : 일 별 비행횟수
@@ -23,11 +23,9 @@ export const MainDashContainer = () => {
const { stcsDayList, stcsAreaList } = useSelector(
state => state.dashboardState
);
- const { user } = useSelector(state => state.authState);
const [dayStartDate, setDayStartDate] = useState(new Date());
const [areaStartDate, setAreaStartDate] = useState(new Date());
- const history = useHistory();
useEffect(() => {
// 일일 비행계획 현황, 일일 비행건수 현황, 일일 비정상상황 현황 Promise.all 처리
diff --git a/src/modules/account/auth/service/jwtTokenUtil.ts b/src/modules/account/auth/service/jwtTokenUtil.ts
index 816bdc21..af8c31f8 100644
--- a/src/modules/account/auth/service/jwtTokenUtil.ts
+++ b/src/modules/account/auth/service/jwtTokenUtil.ts
@@ -25,7 +25,7 @@ export const getAccessToken = async () => {
let token = cookieStorage.getCookie(COOKIE_ACCESS_TOKEN);
if (!token || token == undefined || token == 'undefined') {
- store.dispatch(Actions.setLogout.request());
+ // store.dispatch(Actions.setLogout.request());
return '';
}
diff --git a/src/modules/utils/customAxiosUtil.ts b/src/modules/utils/customAxiosUtil.ts
index a7da254e..65ccbd24 100644
--- a/src/modules/utils/customAxiosUtil.ts
+++ b/src/modules/utils/customAxiosUtil.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios, { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios';
import { HOST } from '../../configs/constants';
import { getAccessToken } from '../account/auth/service/jwtTokenUtil';
import { store } from './../../redux/storeConfig/store';
@@ -37,22 +37,10 @@ clientInstance.interceptors.response.use(
store.dispatch(clientLoaded());
return response.data;
},
- error => {
- // const message = error?.message || '';
-
- // const name = error?.name || '';
-
- // if (error?.response?.status == 401) {
- // let refreshToken = await refreshTokenAPI(userData.cstmrSno,getRefreshToken());
- // store.dispatch(
- // Actions.refresh.request({
- // cstmrSno: userData.cstmrSno,
- // refreshToken: getRefreshToken()
- // })
- // );
- //store.dispatch(Actions.setLogout.request());
- // } else {
- // }
+ (error: AxiosError) => {
+ const { message } = error;
+ const { method, url } = error.config as AxiosRequestConfig;
+ const { status, statusText } = error.response as AxiosResponse;
return Promise.reject(error);
}
diff --git a/src/router/hoc/authenticationCheck.tsx b/src/router/hoc/authenticationCheck.tsx
index 2a5bb5ac..dde559eb 100644
--- a/src/router/hoc/authenticationCheck.tsx
+++ b/src/router/hoc/authenticationCheck.tsx
@@ -1,51 +1,51 @@
import { ReactNode, useEffect } from 'react';
import { RouteComponentProps } from 'react-router-dom';
import { useSelector, useDispatch } from '@store/storeConfig/store';
-import * as Actions from '../../modules/account/auth/actions';
-import clientInstance from '../../modules/utils/customAxiosUtil';
-import { checkCookie } from '@src/_redux/features/account/auth/authThunk';
-import { MessageModal } from '@src/components/message/MessageModal';
-import { MessageErrorModal } from '@src/components/message/MessageErrorModal';
-import { MessageInfoModal } from '@src/components/message/MessageInfoModal';
+import { checkToken } from '@src/_redux/features/account/auth/authThunk';
+import { ICheckAuthencationRs } from '@src/_redux/features/account/auth/authState';
interface IOption {
authRoute?: boolean;
}
+interface IProps extends RouteComponentProps {
+ user?: ICheckAuthencationRs;
+}
+
export default function (SpecificComponent: ReactNode, option: IOption) {
function AuthenticationCheck(props: RouteComponentProps) {
- const user = useSelector(state => state.authState.user);
const dispatch = useDispatch();
+ const { user } = useSelector(state => state.authState);
useEffect(() => {
const tokenVerification = async () => {
try {
+ // 로그인 해야만 접근 가능한 페이지인지 체크하는 옵션
const { authRoute } = option;
- if (authRoute) {
- const {
- data: { result }
- } = await clientInstance.get('/api/acnt/jwt/valid/token');
- if (!result) {
- props.history.replace('/account/login');
+ const {
+ payload: { result }
+ } = await dispatch(checkToken() as any);
+ console.log(result);
+ console.log(authRoute);
+ if (!result) {
+ if (authRoute) props.history.push('/account/login');
+ } else {
+ if (!authRoute) {
+ props.history.replace('/main/dashboard');
}
- dispatch(checkCookie());
- // dispatch(Actions.checkAuthencation.request());
}
} catch (error) {
- props.history.replace('/account/login');
+ // props.history.replace('/account/login');
}
};
tokenVerification();
}, []);
- const Component: (props: RouteComponentProps) => JSX.Element =
- SpecificComponent as (props: RouteComponentProps) => JSX.Element;
+ const Component: (props: IProps) => JSX.Element = SpecificComponent as (
+ props: IProps
+ ) => JSX.Element;
- return (
- <>
-
- >
- );
+ return
;
}
return AuthenticationCheck;
}
diff --git a/src/views/account/AccountLoginView.js b/src/views/account/AccountLoginView.js
index 0710d918..da66abdd 100644
--- a/src/views/account/AccountLoginView.js
+++ b/src/views/account/AccountLoginView.js
@@ -1,6 +1,6 @@
import { AccountLogin } from '../../components/account/login/AccountLogin';
const AccountLoginView = props => {
- return
;
+ return
;
};
export default AccountLoginView;
diff --git a/src/views/basis/dron/BasisDron.js b/src/views/basis/dron/BasisDron.js
index a3f4298f..e76b06cb 100644
--- a/src/views/basis/dron/BasisDron.js
+++ b/src/views/basis/dron/BasisDron.js
@@ -4,10 +4,10 @@ import '@styles/react/libs/tables/react-dataTable-component.scss';
import '../../../assets/css/custom.css';
import { BasisDronContainer } from '../../../containers/basis/dron/BasisDronContainer';
-const BasisDron = () => {
+const BasisDron = props => {
return (
-
+
{/* */}
{/* */}
diff --git a/src/views/basis/group/BasisGroup.js b/src/views/basis/group/BasisGroup.js
index 2a32f3a9..b82f19d8 100644
--- a/src/views/basis/group/BasisGroup.js
+++ b/src/views/basis/group/BasisGroup.js
@@ -4,10 +4,10 @@ import '@styles/react/libs/tables/react-dataTable-component.scss';
import '../../../assets/css/custom.css';
import { BasisGroupContainer } from '../../../containers/basis/group/BasisGroupContainer';
-const BasisGroup = () => {
+const BasisGroup = props => {
return (
-
+
);
};
diff --git a/src/views/basis/group/BasisGroupAproval.js b/src/views/basis/group/BasisGroupAproval.js
index b17ee9ed..c709deff 100644
--- a/src/views/basis/group/BasisGroupAproval.js
+++ b/src/views/basis/group/BasisGroupAproval.js
@@ -4,10 +4,10 @@ import '@styles/react/libs/tables/react-dataTable-component.scss';
import '../../../assets/css/custom.css';
import { BasisGroupApprovalContainer } from '../../../containers/basis/group/BasisGroupApprovalContainer';
-const BasisGroupAproval = () => {
+const BasisGroupAproval = props => {
return (
-
+
);
};
diff --git a/src/views/basis/group/BasisGroupDetail.js b/src/views/basis/group/BasisGroupDetail.js
index 1401797f..2e34a1e0 100644
--- a/src/views/basis/group/BasisGroupDetail.js
+++ b/src/views/basis/group/BasisGroupDetail.js
@@ -4,10 +4,10 @@ import '@styles/react/libs/tables/react-dataTable-component.scss';
import '../../../assets/css/custom.css';
import { BasisGroupDetailContainer } from '../../../containers/basis/group/BasisGroupDetailContainer';
-const BasisGroupDetail = () => {
+const BasisGroupDetail = props => {
return (
-
+
);
};
diff --git a/src/views/basis/group/BasisGroupDetailJoin.js b/src/views/basis/group/BasisGroupDetailJoin.js
index 4f954d1f..379af447 100644
--- a/src/views/basis/group/BasisGroupDetailJoin.js
+++ b/src/views/basis/group/BasisGroupDetailJoin.js
@@ -4,10 +4,10 @@ import '../../../assets/css/custom.css';
import { BasisGroupDetailJoinContainer } from '../../../containers/basis/group/BasisGroupDetailJoinContainer';
-const BasisGroupDetailJoin = () => {
+const BasisGroupDetailJoin = props => {
return (
-
+
);
};
diff --git a/src/views/basis/group/BasisGroupUsers.js b/src/views/basis/group/BasisGroupUsers.js
index b08db3c5..4ad2e308 100644
--- a/src/views/basis/group/BasisGroupUsers.js
+++ b/src/views/basis/group/BasisGroupUsers.js
@@ -4,10 +4,10 @@ import '@styles/react/libs/tables/react-dataTable-component.scss';
import '../../../assets/css/custom.css';
import { BasisGroupUsersContainer } from '../../../containers/basis/group/BasisGroupUsersContainer';
-const BasisGroupUsers = () => {
+const BasisGroupUsers = props => {
return (
-
+
);
};
diff --git a/src/views/main/MainDashboard.js b/src/views/main/MainDashboard.js
index fec45d84..13d2e702 100644
--- a/src/views/main/MainDashboard.js
+++ b/src/views/main/MainDashboard.js
@@ -10,7 +10,7 @@ const MainDashboard = props => {
{/*
메인보드
*/}
-
+
>
);
};