(24/05/12 - 1) 클로즈 베타 테스트 버전 배포합니다.

fakerdeft · web-flow · commit 3cef8328559f · 2024-05-12T21:27:54.000+09:00
diff --git a/src/components/global/token/tokenManagement.jsx b/src/components/global/token/tokenManagement.jsx
@@ -20,6 +20,7 @@ const fetchToken = async (code) => {
       'Content-Type': 'application/json',
     },
   });
+  
   if (!response.ok) {
     throw new Error(`HTTP error! status: ${response.status}`);
   }
@@ -39,58 +40,49 @@ const TokenManagement = () => {
     const code = query.get('code');
     const role = query.get('role');
 
-    // console.log('code:', code);
-    // console.log('role:', role);
+    console.log('code:', code);
+    console.log('role:', role);
 
     if (!code || !role) {
-      console.error('코드 또는 역할이 URL에 포함되어 있지 않습니다.');
       navigate('/login');
       return;
     }
 
-    fetchToken(code, role)
-      .then((headers) => {
-        const accessToken = headers.get('Authorization');
-        const refreshToken = headers.get('Authorization-refresh');
+    if (role === 'GUEST') {
+      navigate('/login/terms', { state: {code} });
+    } else {
+      fetchToken(code)
+        .then((headers) => {
+          const accessToken = headers.get('Authorization');
+          const refreshToken = headers.get('Authorization-refresh');
 
-        // console.log('accessToken:', accessToken);
-        // console.log('refreshToken:', refreshToken);
+          if (!accessToken || !refreshToken) {
+            alert('토큰을 받아오는 데 실패하였습니다. 다시 시도해주세요.');
+            navigate('/login');
+            return;
+          }
+          dispatch(setTokens(accessToken, refreshToken));
+          localStorage.setItem(ACCESS_TOKEN, accessToken);
+          localStorage.setItem(REFRESH_TOKEN, refreshToken);
 
-        if (!accessToken || !refreshToken) {
-          alert('토큰을 받아오는 데 실패하였습니다. 다시 시도해주세요.');
-          navigate('/login');
-          return;
-        }
-        dispatch(setTokens(accessToken, refreshToken));
-        localStorage.setItem(ACCESS_TOKEN, accessToken);
-        localStorage.setItem(REFRESH_TOKEN, refreshToken);
-        // console.log('redux 저장 상태', store.getState());
-
-        const decoded = decodeToken(accessToken);
-        const userRole = decoded.role;
+          const decoded = decodeToken(accessToken);
 
-        // console.log('userRole:', userRole);
-        // console.log('decoded:', decoded);
-
-        if (userRole === 'GUEST') {
-          // console.log('약관 동의 페이지로 이동합니다.');
-          navigate('/login/terms', { state: { code } });
-        } else if (['MEMBER', 'PREMIUM', 'ADMIN'].includes(userRole)) {
-          // console.log('회원 정보가 존재합니다. 메인 페이지로 이동합니다.');
-          navigate(prevPage);
-          initializeSSE(queryClient, dispatch);
-        } else {
+          if (['MEMBER', 'PREMIUM', 'ADMIN'].includes(decoded.role)) {
+            navigate(prevPage || '/');
+            initializeSSE(queryClient, dispatch);
+          } else {
+            alert('로그인에 실패하였습니다. 다시 시도해주세요.');
+            navigate('/login');
+          }
+        })
+        .catch((error) => {
+          console.error('토큰 요청 중 오류가 발생했습니다:', error);
           alert('로그인에 실패하였습니다. 다시 시도해주세요.');
           navigate('/login');
-        }
-      })
-      .catch((error) => {
-        console.error('토큰 요청 중 오류가 발생했습니다:', error);
-        alert('로그인에 실패하였습니다. 다시 시도해주세요.');
-        navigate('/login');
-      });
-  }, [navigate, location, dispatch]);
+        });
+    }
+  }, [navigate, location, dispatch, queryClient]);
   return null;
 };
 
-export default TokenManagement;
+export default TokenManagement;
diff --git a/src/components/pages/loginPage/nicknamePage.jsx b/src/components/pages/loginPage/nicknamePage.jsx
@@ -157,7 +157,7 @@ const NicknamePage = () => {
         age: ageRange,
         gender: genderData,
       };
-      await fetchAPI('/api/member/nickname', 'POST', body);
+      await fetchAPI('/api/member', 'POST', body);
       navigate('/');
       showSuccessToast('환영합니다!');
     } catch (error) {
diff --git a/src/components/pages/myPage/secessionPage.tsx b/src/components/pages/myPage/secessionPage.tsx
@@ -9,6 +9,10 @@ import TabBar from '../../ui/tabBar/tabBar';
 import SecessionWarning from '../../../asset/image/secessionWarning.svg';
 import { fetchAPI } from '../../global/utils/apiUtil.js';
 import { showErrorToast, showSuccessToast } from '../../ui/toast/toast.tsx';
+import {ACCESS_TOKEN, REFRESH_TOKEN} from '../../global/constants/index.ts'
+import {alertCount} from '../../../store/actions/alertActions.js'
+import { useDispatch } from 'react-redux';
+import {setLoggedIn} from'../../../store/actions/userActions';
 
 const Divider = styled.div`
   height: 0.3rem;
@@ -20,6 +24,7 @@ const Divider = styled.div`
 function SecessionPage() {
   const navigate = useNavigate();
   const location = useLocation();
+  const dispatch = useDispatch();
   const { nickname } = location.state as { nickname: string };
   const [isAgreed, setIsAgreed] = useState(false);
   const [secessionReason, setSecessionReason] = useState('');
@@ -49,7 +54,11 @@ function SecessionPage() {
     try {
       await fetchAPI('/api/member/leave', 'DELETE');
       showSuccessToast('성공적으로 탈퇴 처리되었습니다.');
-      navigate('/');
+      localStorage.removeItem(ACCESS_TOKEN);
+      localStorage.removeItem(REFRESH_TOKEN);
+      dispatch(setLoggedIn(false));
+      dispatch(alertCount(0));
+      navigate('/secessionComplete-page');
     } catch (error) {
       showErrorToast(`탈퇴 처리 중 오류가 발생했습니다: ${error}`);
     }
diff --git a/src/components/pages/searchPage/companyRegistPage.tsx b/src/components/pages/searchPage/companyRegistPage.tsx
@@ -7,7 +7,6 @@ import { StyledPage, StyledHeader } from '../../../styledComponent.js';
 import TitleHeader from '../../ui/header/titleHeader';
 import TabBar from '../../ui/tabBar/tabBar';
 import { city, type } from '../../global/constants/companyOption.ts';
-import { setHeaders } from '../../../utils/utils';
 import { showErrorToast, showSuccessToast } from '../../ui/toast/toast.tsx';
 
 interface CompanyInfoProps {
@@ -20,7 +19,6 @@ interface CompanyInfoProps {
 
 function CompanyRegistPage() {
   const navigate = useNavigate();
-  const headers = setHeaders();
 
   const [companyInfo, setCompanyInfo] = useState({
     name: '',
@@ -69,7 +67,7 @@ function CompanyRegistPage() {
     checkRequiredFields(companyInfo);
 
     try {
-      await axios.post(`${BASE_URL}/api/company`, companyInfo, headers);
+      await axios.post(`${BASE_URL}/api/company`, companyInfo);
       showSuccessToast('기업 등록이 완료되었어요!');
       navigate('/search-company');
     } catch (error) {
diff --git a/src/components/pages/termsPage/termsPage.tsx b/src/components/pages/termsPage/termsPage.tsx
@@ -16,9 +16,10 @@ import { showErrorToast, showSuccessToast } from '../../ui/toast/toast.tsx';
 import { initializeSSE } from '../../global/utils/eventApiUtils.js';
 import { useQueryClient } from '@tanstack/react-query';
 import { useDispatch } from 'react-redux';
+import {setTokens} from '../../../store/actions/authActions';
 
 interface LocationState {
-  code?: string;
+  code: string;
 }
 
 interface TermsAgreement {
@@ -35,8 +36,8 @@ export default function TermsPage() {
   const location = useLocation();
   const queryClient = useQueryClient();
   const dispatch = useDispatch();
-  const { code } = (location.state || {}) as LocationState;
-
+  const { code } = location.state as LocationState;
+  
   // =========================================================== 약관 동의 확인을 위한 부분
   const [allAgreed, setAllAgreed] = useState<boolean>(false);
   const [termsAgreement, setTermsAgreement] = useState<TermsAgreement>({
@@ -105,7 +106,7 @@ export default function TermsPage() {
 
   // =========================================================== 토큰 발급을 위한 부분
 
-  const fetchToken = async (code?: string): Promise<Headers> => {
+  const fetchToken = async (code: string): Promise<Headers> => {
     if (!code) throw new Error('Code is required');
     const response = await fetch(`${BASE_URL}/api/auth/token?code=${code}`, {
       method: 'GET',
@@ -139,6 +140,7 @@ export default function TermsPage() {
 
       localStorage.setItem(ACCESS_TOKEN, accessToken);
       localStorage.setItem(REFRESH_TOKEN, refreshToken);
+      dispatch(setTokens(accessToken, refreshToken));
       navigate('/login/member-info');
       showSuccessToast('회원 가입을 축하드립니다!');
       initializeSSE(queryClient, dispatch);
