From e6cb05bb1529692b06d12c3ebe42de42e26dc23f Mon Sep 17 00:00:00 2001 From: yoonyesol Date: Sun, 27 Oct 2024 14:52:21 +0900 Subject: [PATCH 1/4] =?UTF-8?q?Fix:=20=EC=83=88=EB=A1=9C=EA=B3=A0=EC=B9=A8?= =?UTF-8?q?=20=ED=9B=84=20isAuthenticated=20=EC=B4=88=EA=B8=B0=ED=99=94=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=EB=A5=BC=20=ED=95=B4=EA=B2=B0=ED=95=98?= =?UTF-8?q?=EA=B8=B0=20=EC=9C=84=ED=95=9C=20=EC=98=81=EC=86=8D=EC=84=B1=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/Header.tsx | 4 ++-- src/mocks/services/authServiceHandler.ts | 2 +- src/routes/AfterLoginRoute.tsx | 4 ++-- src/routes/BeforeLoginRoute.tsx | 4 ++-- src/stores/useStore.ts | 1 + 5 files changed, 8 insertions(+), 7 deletions(-) diff --git a/src/components/common/Header.tsx b/src/components/common/Header.tsx index 152dd7df..63782aee 100644 --- a/src/components/common/Header.tsx +++ b/src/components/common/Header.tsx @@ -45,9 +45,9 @@ export default function Header() { diff --git a/src/mocks/services/authServiceHandler.ts b/src/mocks/services/authServiceHandler.ts index a18288b4..c0f2aee8 100644 --- a/src/mocks/services/authServiceHandler.ts +++ b/src/mocks/services/authServiceHandler.ts @@ -2,7 +2,7 @@ import axios from 'axios'; import Cookies from 'js-cookie'; import { http, HttpResponse } from 'msw'; import { AUTH_SETTINGS } from '@constants/settings'; -import { JWT_TOKEN_DUMMY, TEMP_PASSWORD_DUMMY, USER_DUMMY, VERIFICATION_CODE_DUMMY } from '@mocks/mockData'; +import { TEMP_PASSWORD_DUMMY, USER_DUMMY, VERIFICATION_CODE_DUMMY } from '@mocks/mockData'; import { EMAIL_REGEX } from '@constants/regex'; import { convertTokenToUserId, generateDummyToken } from '@utils/converter'; import { diff --git a/src/routes/AfterLoginRoute.tsx b/src/routes/AfterLoginRoute.tsx index e3c91b49..f6d3892d 100644 --- a/src/routes/AfterLoginRoute.tsx +++ b/src/routes/AfterLoginRoute.tsx @@ -3,9 +3,9 @@ import type { PropsWithChildren } from 'react'; import { Navigate, Outlet } from 'react-router-dom'; export default function AfterLoginRoute({ children }: PropsWithChildren) { - const { isAuthenticated, userInfo } = useStore(); + const { isAuthenticated } = useStore(); - if (!isAuthenticated && !userInfo.userId) return ; + if (!isAuthenticated) return ; return children || ; } diff --git a/src/routes/BeforeLoginRoute.tsx b/src/routes/BeforeLoginRoute.tsx index 6f50b7e9..7aacd36b 100644 --- a/src/routes/BeforeLoginRoute.tsx +++ b/src/routes/BeforeLoginRoute.tsx @@ -3,9 +3,9 @@ import type { PropsWithChildren } from 'react'; import { Navigate, Outlet } from 'react-router-dom'; export default function BeforeLoginRoute({ children }: PropsWithChildren) { - const { isAuthenticated, userInfo } = useStore(); + const { isAuthenticated } = useStore(); - if (isAuthenticated || userInfo.userId) return ; + if (isAuthenticated) return ; return children || ; } diff --git a/src/stores/useStore.ts b/src/stores/useStore.ts index e5be59fa..0fb5d5d1 100644 --- a/src/stores/useStore.ts +++ b/src/stores/useStore.ts @@ -136,6 +136,7 @@ export const useStore = create()( })), partialize: (state) => ({ userInfo: state.userInfo, + isAuthenticated: state.isAuthenticated, }), }, ), From a44d8456d73adf1294a49195c137165a06119f7d Mon Sep 17 00:00:00 2001 From: yoonyesol Date: Sun, 27 Oct 2024 15:42:53 +0900 Subject: [PATCH 2/4] =?UTF-8?q?Fix:=20=EC=83=88=EB=A1=9C=EA=B3=A0=EC=B9=A8?= =?UTF-8?q?=20=EC=8B=9C=20zustand=20=EC=8A=A4=ED=86=A0=EC=96=B4=EC=9D=98?= =?UTF-8?q?=20AT=EA=B0=80=20=ED=9C=98=EB=B0=9C=EB=90=98=EB=8A=94=20?= =?UTF-8?q?=ED=98=84=EC=83=81=20=EB=B3=B4=EC=99=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mocks/services/authServiceHandler.ts | 7 ++--- src/routes/AfterLoginRoute.tsx | 33 +++++++++++++++++++++--- 2 files changed, 32 insertions(+), 8 deletions(-) diff --git a/src/mocks/services/authServiceHandler.ts b/src/mocks/services/authServiceHandler.ts index c0f2aee8..50e5e8ff 100644 --- a/src/mocks/services/authServiceHandler.ts +++ b/src/mocks/services/authServiceHandler.ts @@ -208,10 +208,7 @@ const authServiceHandler = [ }), // 액세스 토큰 갱신 API - http.post(`${BASE_URL}/user/refresh`, async ({ cookies, request }) => { - const accessToken = request.headers.get('Authorization'); - if (!accessToken) return new HttpResponse(null, { status: 401 }); - + http.post(`${BASE_URL}/user/refresh`, async ({ cookies }) => { const { refreshToken, refreshTokenExpiresAt } = cookies; const cookieRefreshToken = Cookies.get('refreshToken'); @@ -228,7 +225,7 @@ const authServiceHandler = [ return HttpResponse.json({ message: '리프레시 토큰이 만료되었습니다.' }, { status: 401 }); } - const userId = convertTokenToUserId(accessToken); + const userId = convertTokenToUserId(refreshToken); if (!userId) return new HttpResponse(null, { status: 401 }); const newAccessToken = generateDummyToken(userId); diff --git a/src/routes/AfterLoginRoute.tsx b/src/routes/AfterLoginRoute.tsx index f6d3892d..f9cb97ee 100644 --- a/src/routes/AfterLoginRoute.tsx +++ b/src/routes/AfterLoginRoute.tsx @@ -1,9 +1,36 @@ import useStore from '@stores/useStore'; -import type { PropsWithChildren } from 'react'; -import { Navigate, Outlet } from 'react-router-dom'; +import { useEffect, type PropsWithChildren } from 'react'; +import { Navigate, Outlet, useNavigate } from 'react-router-dom'; +import useToast from '@/hooks/useToast'; +import { getAccessToken } from '@/services/authService'; export default function AfterLoginRoute({ children }: PropsWithChildren) { - const { isAuthenticated } = useStore(); + const { toastError } = useToast(); + const navigate = useNavigate(); + const { onLogout, onLogin, clearUserInfo, accessToken, isAuthenticated } = useStore(); + + useEffect(() => { + const autoRefreshToken = async () => { + try { + const refreshResponse = await getAccessToken(); + const newAccessToken = refreshResponse.headers.authorization; + + if (!newAccessToken) throw new Error('토큰 발급에 실패했습니다.'); + + onLogin(newAccessToken.split(' ')[1]); + } catch (error) { + // 토큰 갱신 실패 시 처리 + toastError('로그인 정보가 만료되었습니다. 다시 로그인 해주세요.'); + setTimeout(() => { + onLogout(); + clearUserInfo(); + navigate('/signin', { replace: true }); + }, 2000); + } + }; + + if (isAuthenticated && !accessToken) autoRefreshToken(); + }, [accessToken]); if (!isAuthenticated) return ; From efcd52392704422ab72f254d23d8e3e43d4d5974 Mon Sep 17 00:00:00 2001 From: yoonyesol Date: Mon, 4 Nov 2024 23:55:39 +0900 Subject: [PATCH 3/4] =?UTF-8?q?Fix:=20#233=20=EC=9D=B4=EB=AF=B8=EC=A7=80?= =?UTF-8?q?=20=EC=82=AD=EC=A0=9C=20=EC=8B=9C,=20=EA=B8=B0=EB=93=B1?= =?UTF-8?q?=EB=A1=9D=EB=90=9C=20=EC=9D=B4=EB=AF=B8=EC=A7=80=EA=B0=80=20?= =?UTF-8?q?=EC=95=84=EB=8B=8C=20=EB=8B=A4=EB=A5=B8=20=EC=9D=B4=EB=AF=B8?= =?UTF-8?q?=EC=A7=80=EB=A5=BC=20=EC=B0=B8=EC=A1=B0=20=EC=82=AD=EC=A0=9C?= =?UTF-8?q?=ED=95=98=EA=B3=A0=20=EC=9E=88=EB=8D=98=20=EC=97=90=EB=9F=AC=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 1 + src/components/user/auth-form/ProfileImageContainer.tsx | 3 --- src/routes/AfterLoginRoute.tsx | 6 +++--- src/stores/useStore.ts | 1 + 4 files changed, 5 insertions(+), 6 deletions(-) diff --git a/.gitignore b/.gitignore index 22e8f244..88488bdb 100644 --- a/.gitignore +++ b/.gitignore @@ -34,6 +34,7 @@ dist-ssr .env.development.local .env.test.local .env.production.local +.env.staging # etc .history diff --git a/src/components/user/auth-form/ProfileImageContainer.tsx b/src/components/user/auth-form/ProfileImageContainer.tsx index fdd5c39c..c961f47d 100644 --- a/src/components/user/auth-form/ProfileImageContainer.tsx +++ b/src/components/user/auth-form/ProfileImageContainer.tsx @@ -61,9 +61,6 @@ export default function ProfileImageContainer({ imageUrl, setImageUrl }: Profile } uploadImageMutate({ file }); - - const localImageUrl = URL.createObjectURL(file); - setImageUrl(localImageUrl); }; const handleRemoveImg = () => { diff --git a/src/routes/AfterLoginRoute.tsx b/src/routes/AfterLoginRoute.tsx index f9cb97ee..f2d5e406 100644 --- a/src/routes/AfterLoginRoute.tsx +++ b/src/routes/AfterLoginRoute.tsx @@ -1,8 +1,8 @@ -import useStore from '@stores/useStore'; import { useEffect, type PropsWithChildren } from 'react'; import { Navigate, Outlet, useNavigate } from 'react-router-dom'; -import useToast from '@/hooks/useToast'; -import { getAccessToken } from '@/services/authService'; +import useToast from '@hooks/useToast'; +import useStore from '@stores/useStore'; +import { getAccessToken } from '@services/authService'; export default function AfterLoginRoute({ children }: PropsWithChildren) { const { toastError } = useToast(); diff --git a/src/stores/useStore.ts b/src/stores/useStore.ts index 0fb5d5d1..8d1ae3c3 100644 --- a/src/stores/useStore.ts +++ b/src/stores/useStore.ts @@ -137,6 +137,7 @@ export const useStore = create()( partialize: (state) => ({ userInfo: state.userInfo, isAuthenticated: state.isAuthenticated, + isVerified: state.isVerified, }), }, ), From 9c852676f82f50bbbc6bcd624e6fbfc2f8690a2e Mon Sep 17 00:00:00 2001 From: yoonyesol Date: Tue, 5 Nov 2024 00:03:16 +0900 Subject: [PATCH 4/4] =?UTF-8?q?Chore:=20#233=20gitignore=20=EC=A4=91?= =?UTF-8?q?=EB=B3=B5=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 1 - 1 file changed, 1 deletion(-) diff --git a/.gitignore b/.gitignore index 3b63f734..af00a142 100644 --- a/.gitignore +++ b/.gitignore @@ -34,7 +34,6 @@ dist-ssr .env.development.local .env.test.local .env.production.local -.env.staging # https local cert localhost-key.pem