카카오·네이버 로그인이 로컬에선 되는데 배포 후 안 될 때
AI로 붙인 카카오·네이버 소셜 로그인이 로컬에서는 잘 돌아가다가 배포한 운영 도메인에서만 실패할 때, Redirect URI, 환경 변수, 동의 항목, 쿠키까지 점검할 순서를 정리했습니다.
AI로 카카오 로그인이나 네이버 로그인을 붙이고 로컬에서 테스트하면 보통 잘 됩니다. 인가 코드도 받아오고, 사용자 정보도 가져오고, 로그인 후 화면 이동까지 매끄럽게 흘러가죠.
그런데 배포한 운영 도메인에서 같은 동작을 하면 어디로도 못 갑니다. "카카오에서 보낸 페이지로 돌아오지 못했습니다" 라는 메시지가 뜨거나, 흰 화면이 나오거나, localhost:3000으로 엉뚱한 리다이렉트가 일어납니다.
이건 코드 문제가 아니라 거의 100% 설정 문제입니다. 그것도 카카오·네이버 개발자 콘솔과 우리 서비스 양쪽을 같이 봐야 풀리는 문제입니다.
LastFix 무료 진단
AI·바이브코딩으로 해결되지 않는 개발 이슈가 있다면 원인부터 확인하세요
배포 오류, UI 깨짐, 결제·예약 연동, 작은 기능 수정을 단건으로 진단하고 필요한 범위만 정리합니다.
Redirect URI는 한 글자도 어긋나면 안 된다
OAuth 로그인이 동작하는 핵심은 Redirect URI입니다. 카카오나 네이버에 등록된 주소와, 우리 코드가 보내는 주소가 글자 단위로 일치해야 합니다.
자주 보이는 미스매치:
- 등록은 https://lastfix.kr/auth/callback / 코드는 https://www.lastfix.kr/auth/callback (www 차이)
- 등록은 http://localhost:3000/auth/callback / 코드는 https://lastfix.kr/auth/callback (프로토콜과 도메인 둘 다 다름)
- 등록 주소 끝에는 슬래시가 있는데 코드에서 보내는 주소에는 슬래시가 없음
이 중 하나만 어긋나도 카카오는 인가 코드를 돌려주지 않습니다. AI는 코드 안의 redirect URI까지는 잘 만들지만, 카카오 개발자 콘솔에 직접 접속해 등록하는 일은 사람이 해야 합니다.
배포 도메인에서만 안 된다면 가장 먼저 의심할 곳입니다.
운영 도메인이 콘솔에 등록되어 있는지
개발 초기에는 보통 localhost:3000을 Redirect URI로 등록해두고 시작합니다. 그 상태로 배포하면 운영 도메인은 카카오·네이버 입장에서 처음 보는 주소입니다.
해야 할 일:
- 카카오 개발자 콘솔에서 Redirect URI에 운영 도메인을 추가합니다 (localhost는 빼지 말고 함께 둬도 됩니다)
- 네이버 개발자센터에서는 API 설정의 Callback URL에 운영 도메인을 추가합니다
- 카카오의 경우 "플랫폼 → Web"의 사이트 도메인 항목에도 운영 도메인을 별도로 등록해야 합니다
특히 카카오는 "플랫폼"과 "Redirect URI" 두 군데에 모두 운영 도메인이 들어가 있어야 합니다. 한쪽만 있고 다른 쪽이 비어 있으면 응답을 받지 못합니다. 이게 가장 자주 빠지는 부분입니다.
환경 변수의 도메인이 운영 기준인지
두 번째로 많이 보이는 원인입니다. 환경 변수에 적힌 도메인이 아직 localhost거나, 옛날 미리보기 주소로 남아 있는 경우입니다.
코드에서는 보통 NEXT_PUBLIC_BASE_URL 같은 환경 변수에 도메인을 담고, 그 값에 /auth/callback 을 붙여서 redirect URI를 만듭니다. 이 환경 변수가 http://localhost:3000으로 남아 있으면, 운영 사이트는 카카오에 "localhost로 돌려보내달라" 고 요청하는 셈입니다. 카카오는 그 주소를 등록된 운영 주소로 인식하지 못해 거부합니다.
확인할 곳:
- Vercel 환경 변수의 NEXT_PUBLIC_BASE_URL 또는 비슷한 이름의 변수
- 코드 안에 'localhost' 라는 문자열이 남아 있지 않은지 (Cmd+F로 검색)
- AI가 임시로 박아둔 redirect_uri 값이 다른 도메인으로 하드코딩되어 있지 않은지
Vercel 환경 변수를 고쳤다면 재배포까지 해야 적용됩니다.
동의 항목과 검수 단계
카카오 로그인은 다른 OAuth보다 한 단계가 더 있습니다. 동의 항목 설정입니다.
이메일이나 프로필 정보 같은 항목 중 일부는 비즈니스 앱으로 전환해야만 받을 수 있습니다. AI가 만든 코드에서 user.email을 가져다 쓰는데 카카오에서 이메일 동의가 막혀 있으면, 사용자 정보는 받아오지만 이메일이 빈 값으로 돌아옵니다.
증상:
- 로그인은 되는데 user.email이 undefined
- 회원가입에서 이메일을 못 읽어 다음 단계로 넘어가지 못함
- 카카오 동의 화면에 이메일 항목이 아예 표시되지 않음
해결은 카카오 개발자 콘솔의 "내 애플리케이션 → 카카오 로그인 → 동의 항목" 에서 필요한 항목을 활성화하는 것입니다. 일부 항목은 비즈 앱 전환 후 검수가 필요합니다.
네이버는 검수 요청이라는 단계가 별도로 있습니다. 검수 전에는 등록된 테스트 계정만 로그인할 수 있고, 일반 사용자는 막힙니다. 운영을 시작했는데 본인 계정만 되고 다른 사람은 안 된다면 이걸 의심하세요.
쿠키와 세션 도메인
여기까지 다 맞췄는데도 운영에서만 로그인이 풀리거나 세션이 잡히지 않는 경우가 있습니다.
이때는 쿠키 설정을 봐야 합니다.
- 쿠키의 domain이 localhost 기준으로 되어 있다
- secure 옵션이 false라 https에서 쿠키가 잡히지 않는다
- SameSite 옵션이 잘못 설정되어 OAuth 리다이렉트 후 쿠키가 사라진다
증상은 보통 "로그인이 됐다고 화면은 뜨는데, 새로고침하면 다시 로그아웃 상태" 입니다. 카카오 동의까지 정상적으로 끝났는데도 이런 증상이 나오면 쿠키 흐름을 의심해야 합니다.
이 영역은 비개발자가 직접 만지기에는 까다로운 편입니다. AI에게 "운영 도메인 기준으로 세션 쿠키 옵션을 점검해줘" 라고 요청하면서, 실제로 쿠키가 어떤 옵션으로 발급되는지 확인해 달라고 하는 게 안전합니다.
정리하면
카카오·네이버 로그인이 배포 후에만 안 되는 문제는 코드를 의심하면 답이 잘 안 나옵니다. 거의 항상 다음 네 가지 중 하나입니다.
- 카카오·네이버 콘솔 Redirect URI에 운영 도메인이 없다
- 환경 변수에 운영 도메인이 들어가 있지 않다
- 동의 항목이나 검수 단계가 빠져 있다
- 쿠키 설정이 운영 환경에 맞지 않다
이 흐름을 먼저 확인하고, 코드는 그 다음입니다. AI에게 "코드부터 고쳐달라" 고 하면 멀쩡한 OAuth 코드를 새로 짜기 시작해서 더 꼬이는 경우가 많습니다.
관련 글: Vercel 환경변수가 적용 안 될 때, 비개발자가 점검할 5가지, Cursor가 같은 에러를 반복할 때: AI 코딩 버그 수정 기준
LastFix 무료 진단
AI·바이브코딩으로 해결되지 않는 개발 이슈가 있다면 원인부터 확인하세요
배포 오류, UI 깨짐, 결제·예약 연동, 작은 기능 수정을 단건으로 진단하고 필요한 범위만 정리합니다.