카카오 로그인 API를 서비스에서 연동하기 위해서는 여러 절차를 거쳐야 한다. 제대로 연동하기 위해서는 절차에 대한 이해가 선행되어야 한다.

1. 카카오 로그인 API 프로세스

[그림1] 카카오 로그인 API 프로세스
출처: https://data-jj.tistory.com/53

인가 코드 받기

• 인가 코드 받기: 유저가 로그인 할 때 프론트 엔드에서 카카오 인증 서버에 인가코드 request를 보낸다.
• 인가 코드 주기:받은 인가 코드를 백엔드로 보내준다.

카카오 토큰 받기

• 카카오 토큰 받기: 백엔드에서 프론트로부터 받은 인가 코드를 카카오 인증 서버에 건네주고 카카오 서버로부터 카카오 토큰을 받는다.

유저 정보 받기

• 카카오 토큰 주기: 백엔드에서 카카오 토큰을 카카오 서버에 주고 유저의 정보를 받는다. 유저 정보는 유저가 어느 정보를 승인 했는지에 따라서 정보의 양이 상이하다.

---

2. 카카오 로그인 REST API 연동하기

1) Redirect URI 설정

• 회원가입: 카카오 디밸로퍼 사이트에 회원가입을 한다.
• 애플리케이션 등록: 내 애플리케이션에 들어가 애플리케이션을 추가한다.
• redirect uri 설정: 내 애플리케이션에 > 앱 설정 > 플랫폼에 들어가서 내 서비스에 맞는 플래폼의 "플랫폼 등록"을 클릭한다. 인가 코드를 받을 redirect uri를 설정한다. 이 uri는 백엔드에서 경로를 정하는 것이 좋지만 꼭 프론트에서 접근할 수 있는 Host로 설정해야 한다. 그 이유는 프론트에서 인가 코드를 받고 넘기는 작업을 해야 하는데 접근 할 수 없는 Host로 지정하면 접근하지 못하기 때문이다.
  (ex. localhost:3000/asdf/asdf)

---

2) 인가 코드 받기

request

Host: kauth.kakao.com
GET /oauth/authorize?client_id=${REST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code HTTP/1.1

[그림3] 인가 코드 받기

• client_id=${REST_API_KEY}: REST_API_KEY는 내 애플리케이션 > 앱 설정 > 앱 키 > REST API 키 에서 확인할 수 있다.
• redirect_uri=${REDIRECT_URI}: 위에서 설정한 redirect_uri를 기입한다.

최종 요청 형태는 아래와 같다.

https://kauth.kakao.com/oauth/authorize?client_id=${REST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code

response

http://localhost:3000/asdf/asdf?code={발급된 인가 코드}

---

3) 카카오 토큰 받기

request

Host: kauth.kakao.com
POST /oauth/token HTTP/1.1
Content-type: application/x-www-form-urlencoded;charset=utf-8

[그림3] 카카오 토큰 받기

def get_kakao_token(code):
     auth_code       = code
     kakao_token_api = "https://kauth.kakao.com/oauth/token"
     data            = {
         "grant_type"      : 'authorization_code',
         "client_id"       : KAKAO_REST_API_KEY,
         "redirect_uri"    : KAKAO_REDIRECT_URI,
         "code"            : auth_code
        }
     headers = {'Content-type' : 'application/x-www-form-urlencoded;charset=utf-8'}
     requests.post(kakao_token_api, headers=headers, data=data)
     access_token = token_response.json().get('access_token')

body

• "grant_type" : "authorization_code"
• "client_id" : REST_API_KEY
• "redirect_uri" : REDIRECT_URI
• "code" : auth_code
  - 받은 인가 코드를 auth_code에 입력한다.
• access_token

response

{
  "access_token":"",
  "token_type":"bearer",
  "refresh_token":"",
  "id_token":"",
  "expires_in": int_type,
  "scope":"account_email openid profile_nickname",
  "refresh_token_expires_in": int_type
}

• 위와 같이 response가 오기 때문에 여기서 acceess_token만 받아서 이후 사용자 정보에 사용한다.

---

4) 사용자 정보 받기

request

Request: 엑세스 토큰 사용

Host: kapi.kakao.com
GET/POST /v2/user/me HTTP/1.1
Authorization: Bearer ${ACCESS_TOKEN}
Content-type: application/x-www-form-urlencoded;charset=utf-8

• 사용자 정보 받기 API를 호출할 때 엑세스 토큰 혹은 어드민 키를 사용하여 호출한다. 위에서는 엑세스 토큰을 사용해서 진행하였으므로 엑세스 토큰을 사용한 호출에 대해서만 알아보고자 한다.

headers = {
      "Authorization": f"Bearer {access_token}",
      "Content-type" : "application/x-www-form-urlencoded;charset=utf-8"
}

user_info_response = requests.post("https://kapi.kakao.com/v2/user/me", headers=headers).json()

headers

• "Authorization": f"Bearer {access_token}"
  - {access_token}에 발급 받은 토큰 값을 넣는다.
• "Content-type" : "application/x-www-form-urlencoded;charset=utf-8"
  - 그대로 headers에 넣는다.
  

[requests에 대한 응답을 json으로 수신]

응답에 유효한 JSON이 포함되어 있으면 Response 객체에서 .json() 메서드를 사용하여 디코딩 된 결과를 얻는다. json() 메서드를 사용하지 않으면 응답 코드만을 받기 때문에 꼭 .json()을 사용해서 다른 정보까지 받는다.

response

{
	'id': int_type, 
	'connected_at': '연결 시간', 
	'properties': {'nickname': '닉네임'}, 
	'kakao_account': 
		{
		'profile_nickname_needs_agreement': False, 
		'profile': {'nickname': '닉네임'}, 
		'has_email': True, 
		'email_needs_agreement': False, 
		'is_email_valid': True, 
		'is_email_verified': True, 
		'email': '이메일'
		}
}

• 동의항목: 내 애플리케이션 > 동의항목 에서 수집 할 개인 정보에 대해서 설정을 한다. 이후 로그인 창에서 유저가 수집 동의를 하면 위와 같이 kakao_account에 수집 동의한 정보가 response로 온다.