diff --git a/apps/client/src/app/page.tsx b/apps/client/src/app/page.tsx index a045566f..7b554a70 100644 --- a/apps/client/src/app/page.tsx +++ b/apps/client/src/app/page.tsx @@ -1,3 +1,4 @@ +import { headers } from 'next/headers'; import { redirect } from 'next/navigation'; import { MainPage } from '@/pageContainer'; @@ -24,8 +25,12 @@ export default async function Home({ searchParams }: { searchParams?: { isAdmin? const isAdminRole = authInfo?.role === 'ADMIN' || authInfo?.role === 'ROOT'; if (isAdminRequested && isAdminRole) { - const isStage = process.env.NEXT_PUBLIC_API_BASE_URL?.includes('stage'); - const adminUrl = isStage ? 'https://admin.stage.hellogsm.kr' : 'https://admin.hellogsm.kr'; + const host = headers().get('host') ?? ''; + const adminUrl = host.includes('localhost') + ? 'http://localhost:3001' + : host.includes('stage') + ? 'https://admin.stage.hellogsm.kr' + : 'https://admin.hellogsm.kr'; redirect(adminUrl); } diff --git a/apps/client/src/pageContainer/CallbackPage/index.tsx b/apps/client/src/pageContainer/CallbackPage/index.tsx index 0445ae32..8468be89 100644 --- a/apps/client/src/pageContainer/CallbackPage/index.tsx +++ b/apps/client/src/pageContainer/CallbackPage/index.tsx @@ -22,10 +22,10 @@ const CallbackPage = ({ code, provider }: { code: string; provider: string }) => const handleLoginSuccess = async () => { await queryClient.invalidateQueries({ queryKey: memberQueryKeys.getMyMemberInfo() }); - const currentOrigin = window.location.origin; - const isStage = currentOrigin.includes('stage'); - const clientBaseUrl = isStage ? 'https://www.stage.hellogsm.kr' : 'https://www.hellogsm.kr'; - const nextUrl = provider === 'admin' ? `${clientBaseUrl}/?isAdmin=true` : clientBaseUrl; + const nextUrl = + provider === 'admin' + ? `${window.location.origin}/?isAdmin=true` + : window.location.origin; router.replace(nextUrl); }; @@ -59,10 +59,12 @@ const CallbackPage = ({ code, provider }: { code: string; provider: string }) => return; } + const redirectUri = `${window.location.origin}/callback`; + if (provider === 'google' || provider === 'admin') { - googleLogin(code); + googleLogin({ code, redirectUri }); } else if (provider === 'kakao') { - kakaoLogin(code); + kakaoLogin({ code, redirectUri }); } else { router.replace('/'); toast.error('로그인에 실패했습니다.'); diff --git a/packages/api/src/hooks/auth/useOAuthLogin.ts b/packages/api/src/hooks/auth/useOAuthLogin.ts index 503d51c2..c5526c86 100644 --- a/packages/api/src/hooks/auth/useOAuthLogin.ts +++ b/packages/api/src/hooks/auth/useOAuthLogin.ts @@ -9,11 +9,17 @@ interface ReturnDataType { message: string; } +interface LoginPayload { + code: string; + redirectUri: string; +} + export const useOAuthLogin = ( provider: 'google' | 'kakao', - options?: UseMutationOptions, + options?: UseMutationOptions, ) => useMutation({ - mutationFn: (code: string) => post(authUrl.postLogin(provider), { code }), + mutationFn: ({ code, redirectUri }: LoginPayload) => + post(authUrl.postLogin(provider), { code, redirectUri }), ...options, }); diff --git a/packages/ui/src/components/LoginButton/index.tsx b/packages/ui/src/components/LoginButton/index.tsx index 84fef142..6aa2d668 100644 --- a/packages/ui/src/components/LoginButton/index.tsx +++ b/packages/ui/src/components/LoginButton/index.tsx @@ -39,6 +39,12 @@ interface LoginButtonProps isAdmin?: boolean; } +const getClientOrigin = (origin: string): string => { + if (origin.includes('localhost')) return 'http://localhost:3000'; + if (origin.includes('stage')) return 'https://www.stage.hellogsm.kr'; + return 'https://www.hellogsm.kr'; +}; + const LoginButton = React.forwardRef( ({ className, variant, children, isAdmin = false, ...props }, ref) => { const [redirectUri, setRedirectUri] = React.useState(''); @@ -47,24 +53,10 @@ const LoginButton = React.forwardRef( React.useEffect(() => { if (typeof window !== 'undefined') { - const currentOrigin = window.location.origin; - - const stageOrigins = [ - 'http://localhost:3000', - 'http://localhost:3001', - 'https://www.stage.hellogsm.kr', - 'https://admin.stage.hellogsm.kr', - ]; - - const productionOrigins = ['https://www.hellogsm.kr', 'https://admin.hellogsm.kr']; - - if (stageOrigins.includes(currentOrigin)) { - setRedirectUri('https://www.stage.hellogsm.kr/callback'); - } else if (productionOrigins.includes(currentOrigin)) { - setRedirectUri('https://www.hellogsm.kr/callback'); - } + const origin = isAdmin ? getClientOrigin(window.location.origin) : window.location.origin; + setRedirectUri(`${origin}/callback`); } - }, []); + }, [isAdmin]); React.useEffect(() => { if (redirectUri) {