카카오톡 로그인

[piggmme]

• [x] 카카오톡 로그인 Rest API 방식으로 서비스 연결
• [x] local 에 카톡 로그인 연결
• [x] vercel 환경에 로그인 관련 env 설정
• [x] prod 에 카톡 로그인 연결

[piggmme]

카카오톡 로그인 Rest API 방식으로 서비스 연결

1. https://developers.kakao.com/ 상단 네비게이션 내 애플리케이션 > 애플리케이션 추가하기
2. 내 애플리케이션> 앱 설정 > 플랫폼 > 하단에 Web 플랫폼 등록
3. 사이트 도메인 등록

   
   # 사이트 도메인
   https://cli-meet.com
   http://localhost:5173

기본 도메인

https://cli-meet.com

4. Redirect URI 등록 하기 > 활성화 설정 상태 ON > OpenID Connect 활성화 설정 ON 
5. Redirect URI 추가 

https://cli-meet.com/oauth https://www.cli-meet.com/oauth http://localhost:5173/oauth

6. 요약 정보 > 앱키 > REST API 키 복사

[piggmme]

카카오톡 로그인 개발

export default function KakaoLogin() {
  const KAKAO_AUTH_URL = `https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=${KAKAO_REST_API_KEY}&redirect_uri=${KAKAO_REDIRECT}`

  const loginKakao = () => {
    window.location.replace(`${KAKAO_AUTH_URL}`)
  }

  return (
    <button onClick={loginKakao}>
      카카오로 로그인하기
    </button>
  )
}