🚪 카카오 소셜 로그인 세팅

1. Kakao developers 사이트 접속하여 회원가입 진행

Kakao Developers

2. 상단 [내 애플리케이션] 메뉴 클릭

3. [애플리케이션 추가하기] 버튼 클릭

4. 팝업 창 정보 입력

• 앱 아이콘 [파일 선택]
• 앱 이름
• 회사명
• 동의 체크 박스 : 체크

5. 추가한 애플리케이션 생성됨 → 더블클릭

6. 레프트 메뉴 “플랫폼” 클릭 →  [Web 플랫폼 등록] 클릭

• http://localhost:8080/api/user/kakao/callback

• 활성화 : [ON]으로 활성화 시켜 줌

7. 사이드 메뉴 ) "제품설정 > 카카오 로그인 > 동의항목" 메뉴로 이동

• 닉네임 [설정] 클릭

• 동의 항목 설정 팝업
  • 필수 동의 선택
  • 동의 목적 : 회원가입 용도로 사용할 거라서 "회원가입" 입력

※ 카카오계정(이메일) 설정도 해야하는데, 비활성화 되어있다면 [더보기] 열고 진행!

• 상단 [개인정보 동의항목 심사 신청] 클릭
• [비즈 앱 전환] 클릭  

  

• [카카오비지니스 통합 서비스 약관 동의] 클릭
  • 팝업 동의 진행하여 완료

• 사이드 메뉴 ) 앱 설정 > 비즈니스 > [개인 개발자 비즈 앱 전환] 클릭

• 카카오계정(이메일) [설정] 버튼 클릭
  • 선택 동의 선택
  • 동의 목적 : 회원가입 용도로 사용할 거라서 "회원가입" 입력

    

 

8. 카카오 서버 사용할 준비 완료

9. 사이드 메뉴 ) 앱 키 > REST API 키 [복사] 하여 이용

 

---

REST API 키 환경변수 사용

<button id="login-kakao-btn" onclick="location.href='https://kauth.kakao.com/oauth/authorize?client_id={REST_API_KEY}&redirect_uri=http://localhost:8080/api/user/kakao/callback&response_type=code'">
        카카오로 로그인하기
</button>

• ?client_id={REST_API_KEY} 부분을 아래 코드로 수정

+ ${@environment.getProperty('kakao.api.key')} +

• .env 파일에 Kakao REST API 키 등록

KAKAO_API_KEY={발급 받은 REST API 키}

• .properties 파일에 변수 설정

kakao.api.key=${KAKAO_API_KEY}

---

연결 오류

앱 관리자 설정 오류

등록하지 않은 Redirect URI를 사용해 인가 코드를 요청으로 인해 발생

• 원인 : 기본 8080 이지만, 나는 현재 9090 포트를 사용 중이라서 오류가 난 것!

Redirect URI 등록

1. [내 애플리케이션] > [카카오 로그인] > [Redirect URI] > [Redirect URI 등록]
2. Redirect URI를 등록 하면 정상 작동함!

Kakao Developers