generated from kode-krew/nextjs-template
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Refactor: 인증 인가 서버 route 처리 및 서버 컴포넌트 가딩 처리 1단계 작업 (#82)
* WIP: social-login server component 단 처리중 * Fix: social-login server route 처리 및 예외 처리 추가
- Loading branch information
1 parent
e6b5d5e
commit 2772a12
Showing
5 changed files
with
176 additions
and
40 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,60 @@ | ||
import { SocialLoginRequestParameter } from '@src/app/auth/page'; | ||
import axios, { isAxiosError } from 'axios'; | ||
import { cookies } from 'next/headers'; | ||
import { NextRequest, NextResponse } from 'next/server'; | ||
|
||
const metaTestServerHost = process.env.NEXT_PUBLIC_META_TEST_SERVER_HOST_URL; | ||
|
||
export async function POST(request: NextRequest) { | ||
const { code, socialType }: Omit<SocialLoginRequestParameter, 'loginPath'> = | ||
await request.json(); | ||
|
||
if (!code || !socialType) { | ||
return NextResponse.json({ error: 'Bad Request' }, { status: 400 }); | ||
} | ||
|
||
try { | ||
const serverResponse = await axios.get(`${metaTestServerHost}/auth/login/${socialType}`, { | ||
params: { | ||
code, | ||
}, | ||
}); | ||
|
||
const accessToken = serverResponse.headers.access_token; | ||
const refreshToken = serverResponse.headers.refresh_token; | ||
|
||
// NextResponse에 쿠키 설정 | ||
const response = NextResponse.json({ success: true }); | ||
|
||
// Refresh Token을 HttpOnly 쿠키로 설정 (기간 2주) | ||
cookies().set('rtk', refreshToken, { | ||
httpOnly: true, | ||
secure: process.env.NODE_ENV === 'production', | ||
maxAge: 60 * 60 * 24 * 14, // 2주 | ||
path: '/', | ||
sameSite: 'strict', | ||
}); | ||
|
||
// Access Token을 HttpOnly 쿠키로 설정 (기간 30분) | ||
cookies().set('atk', accessToken, { | ||
httpOnly: true, | ||
secure: process.env.NODE_ENV === 'production', | ||
maxAge: 60 * 30, // 30분 | ||
path: '/', | ||
sameSite: 'strict', | ||
}); | ||
// 새로운 Access Token을 응답 헤더로 클라이언트에 전달 | ||
response.headers.set('Authorization', `Bearer ${accessToken}`); | ||
return response; | ||
} catch (error) { | ||
if (isAxiosError(error) && error.response?.data) { | ||
return NextResponse.json( | ||
{ error: error.response.data.message }, | ||
{ | ||
status: error.response?.status || 500, | ||
}, | ||
); | ||
} | ||
return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 }); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,10 +1,85 @@ | ||
'use client'; | ||
|
||
import useSocialLogin from '@src/hooks/useSocialLogin'; | ||
import { ToastService } from '@src/service/ToastService'; | ||
import axios from 'axios'; | ||
import { useRouter, useSearchParams } from 'next/navigation'; | ||
import { useEffect, useState } from 'react'; | ||
import { useCookies } from 'react-cookie'; | ||
|
||
type SocialLoginType = 'google' | 'kakao'; | ||
|
||
interface SocialLoginInfo { | ||
loginPath: string; | ||
socialType: SocialLoginType; | ||
} | ||
|
||
export interface SocialLoginRequestParameter { | ||
loginPath: string; | ||
code: string; | ||
socialType: SocialLoginType; | ||
} | ||
|
||
const toastService = ToastService.getInstance(); | ||
|
||
const processSocialLogin = async ({ code, socialType, loginPath }: SocialLoginRequestParameter) => { | ||
try { | ||
const { data } = await axios.post( | ||
`${process.env.NEXT_PUBLIC_MATE_TEST_WEB_HOST_URL}/api/social-login`, | ||
{ | ||
code, | ||
socialType, | ||
}, | ||
); | ||
return data; | ||
} catch (error) { | ||
throw error; | ||
} | ||
}; | ||
|
||
const AuthPage = () => { | ||
useSocialLogin(); | ||
return <div />; | ||
const router = useRouter(); | ||
const searchParams = useSearchParams(); | ||
const [loading, setLoading] = useState(true); | ||
const [cookies] = useCookies(['social-login-info']); | ||
const socialLoginInfo = cookies['social-login-info']; | ||
|
||
useEffect(() => { | ||
const handleLogin = async () => { | ||
const code = searchParams.get('code'); | ||
|
||
if (!socialLoginInfo || !code) { | ||
router.replace('/'); | ||
return; | ||
} | ||
|
||
try { | ||
const { loginPath, socialType } = socialLoginInfo as SocialLoginInfo; | ||
const data = await processSocialLogin({ code, socialType, loginPath }); | ||
|
||
if (data) { | ||
toastService.addToast('로그인 되었습니다.'); | ||
router.replace(loginPath ?? '/'); | ||
} else { | ||
toastService.addToast('로그인에 실패하였습니다.'); | ||
router.replace(loginPath ?? '/'); | ||
} | ||
} catch (error) { | ||
console.log(error); | ||
toastService.addToast('로그인 중 오류가 발생했습니다.'); | ||
router.replace('/'); | ||
} finally { | ||
setLoading(false); | ||
} | ||
}; | ||
|
||
handleLogin(); | ||
}, [searchParams, router, socialLoginInfo]); | ||
|
||
if (loading) { | ||
return <p>로그인 처리 중...</p>; | ||
} | ||
|
||
return <></>; | ||
}; | ||
|
||
export default AuthPage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters