diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx index 5c81ebed..7d8e1d69 100644 --- a/src/app/login/page.tsx +++ b/src/app/login/page.tsx @@ -16,9 +16,33 @@ const REDIRECT_URI = export default function Page() { useEffect(() => { - document.addEventListener('onAppleLoginSuccess', (e) => { - console.log(e); - }); + // Apple 로그인 성공 이벤트 리스너 등록 + const handleAppleLoginSuccess = (e: unknown) => { + console.log(e); // 성공 응답 처리 + }; + + // Apple 로그인 실패 이벤트 리스너 등록 + const handleAppleLoginFail = (e: unknown) => { + console.error(e); // 실패 응답 처리 + }; + + document.addEventListener( + 'AppleIDSignInOnSuccess', + handleAppleLoginSuccess, + ); + document.addEventListener('AppleIDSignInOnFailure', handleAppleLoginFail); + + // 컴포넌트 언마운트 시 이벤트 리스너 제거 + return () => { + document.removeEventListener( + 'AppleIDSignInOnSuccess', + handleAppleLoginSuccess, + ); + document.removeEventListener( + 'AppleIDSignInOnFailure', + handleAppleLoginFail, + ); + }; }, []); const { push } = useRouter(); @@ -31,20 +55,7 @@ export default function Page() { const handleClickAppleLoginButton = async () => { try { - const res = await window.AppleID?.auth - .signIn() - .then((response) => { - localStorage.setItem('apple_login_info', JSON.stringify(response)); - const event = new CustomEvent('onAppleLoginSuccess', { - detail: response, - }); - document.dispatchEvent(event); - }) - .catch((error) => { - const event = new CustomEvent('onAppleLoginFail', { detail: error }); - document.dispatchEvent(event); - }); - console.log(res); + await window.AppleID?.auth.signIn(); } catch (error) { console.log(error); } diff --git a/src/components/common/AppleProvider/index.tsx b/src/components/common/AppleProvider/index.tsx index 495d75a3..5509e663 100644 --- a/src/components/common/AppleProvider/index.tsx +++ b/src/components/common/AppleProvider/index.tsx @@ -12,7 +12,7 @@ export default function AppleProvider() { redirectURI: `${process.env.NEXT_PUBLIC_SITE_DOMAIN}/login`, state: 'origin:web', nonce: generateNonce(16), - usePopup: false, + usePopup: true, }); } }; diff --git a/src/middleware.ts b/src/middleware.ts index 719338c1..37056c0d 100644 --- a/src/middleware.ts +++ b/src/middleware.ts @@ -86,21 +86,21 @@ export async function middleware(request: NextRequest) { } } - if (request.nextUrl.pathname === '/login') { - // 이미 리다이렉트된 요청인지 확인 - if (request.nextUrl.searchParams.has('redirected')) { - // 이미 리다이렉트된 경우, 추가 리다이렉트를 수행하지 않음 - return NextResponse.next(); - } else { - // 쿼리 파라미터를 포함한 완전한 URL 구성 - const redirectUrl = request.nextUrl.clone(); - redirectUrl.searchParams.set('type', 'apple'); - redirectUrl.searchParams.set('redirected', 'true'); // 리다이렉트 플래그 설정 - - // 클라이언트에게 리다이렉트 요청 - return NextResponse.redirect(redirectUrl, 303); - } - } + // if (request.nextUrl.pathname === '/login') { + // // 이미 리다이렉트된 요청인지 확인 + // if (request.nextUrl.searchParams.has('redirected')) { + // // 이미 리다이렉트된 경우, 추가 리다이렉트를 수행하지 않음 + // return NextResponse.next(); + // } else { + // // 쿼리 파라미터를 포함한 완전한 URL 구성 + // const redirectUrl = request.nextUrl.clone(); + // redirectUrl.searchParams.set('type', 'apple'); + // redirectUrl.searchParams.set('redirected', 'true'); // 리다이렉트 플래그 설정 + + // // 클라이언트에게 리다이렉트 요청 + // return NextResponse.redirect(redirectUrl, 303); + // } + // } } export const config = {