인프런 커뮤니티 질문&답변
작성한 질문수
로컬에서는 카카오 로그인이 되는데 vercel 배포했더니 안되네요 혹시 알려주실 수 있을까요..?
24.07.19 18:24 작성
·
196
·
수정됨
0
/src/middleware.ts
import { auth } from './auth';
import { NextResponse, NextRequest } from 'next/server';
export async function middleware(request: NextRequest) {
const session = await auth();
if (request.nextUrl.pathname.startsWith('/login')) {
if (session) {
return NextResponse.redirect(new URL('/', request.url));
}
}
if (request.nextUrl.pathname.startsWith('/mypage')) {
if (!session) {
return NextResponse.redirect(new URL('/login', request.url));
}
}
if (request.nextUrl.pathname.startsWith('/admin')) {
if (session?.user?.name !== 'admin') {
return NextResponse.redirect(new URL('/', request.url));
}
}
}
export const config = {
matcher: ['/mypage/:path*', '/admin/:path*', '/login'],
};
/src/auth.ts
import NextAuth from 'next-auth';
import KakaoProvider from 'next-auth/providers/kakao';
export const {
handlers: { GET, POST },
auth,
} = NextAuth({
pages: {
signIn: '/login',
},
providers: [
KakaoProvider({
clientId: process.env.KAKAO_CLIENT_ID!,
clientSecret: process.env.KAKAO_CLIENT_SECRET!,
}),
],
secret: process.env.NEXTAUTH_SECRET,
});
/src/app/api/auth/[...nextauth]/route.ts
export { GET, POST } from '@/auth';
로컬에서는 되는데 vercel 로 배포 하니까 안되네요.. api/auth/error 로 가지고
Failed to load resource: the server responded with a status of 500 ()
/api/auth/session 이렇게 오류가 나네요
"next-auth": "^5.0.0-beta.19", 입니다
답변 2
0
0
2024. 07. 19. 18:26
안녕하세요, 인프런 AI 인턴입니다.
kukhyun4님의 질문을 검토한 결과, 로컬 환경에서는 문제 없이 작동하는 카카오 로그인이 Vercel 배포 후 작동하지 않는 상황에 대한 유사 질문 사례를 찾을 수 있었습니다. 이와 유사한 상황을 겪고 계시다면, 설정 파일 및 환경 변수 관리 방법에 주의 깊게 살펴보셔야 합니다.
Vercel 배포 시, 로컬 환경과는 다른 환경에 있기 때문에 환경 변수가 올바르게 설정되어 있지 않음을 확인해보는 것이 중요합니다. Vercel의 프로젝트 설정에서 환경 변수 관리 부분을 확인하고, 필요한 환경변수(KAKAO_CLIENT_ID, KAKAO_CLIENT_SECRET, NEXTAUTH_SECRET, 등)가 올바르게 입력되었는지, 그리고 올바른 범위(Secrets for preview, development, production 등)에 설정되었는지 점검해보시기 바랍니다.
또한, 배포 환경에서의 오류는 로그를 통해 자세한 내용을 파악할 수 있습니다. Vercel에서 제공하는 로그 기능을 활용하여 구체적인 오류 메시지를 확인해보시고, 특히 500 오류가 발생하는 /api/auth/session 및 /api/auth/error 경로 관련 처리 과정에서 문제가 없는지도 살펴보시는 것이 좋습니다.
다만, 해당 경우와는 다소 차이가 있을 수 있으니, 유사한 설정 문제에서 오는 오류를 살펴볼 수 있게 아래 링크를 참고해 보시는 것을 추천드립니다:
- Failed to load resource: the server responded with a status of 500에서 언급된, next-auth 관련 문제 해결 사례들.
이 ссыл크는 next-auth와 Vercel 배포 중 발생할 수 있는 문제와 관련된 GitHub Isuue 페이지로, 유사한 상황에 대한 해결 방안을 찾을 수 있을 것입니다. 특히, 이러한 오류는 환경 변수 설정, API 경로 설정, 내부 로직의 오류 등 다양한 원인에 의해 발생할 수 있으니, 코드와 설정을 다시 한번 검토해 보시기 바랍니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.