[Swift] 카카오 로그인 API 사용하기

Swift에서 Kakao Login API 사용하기

 

카카오 로그인 V2가 나왔습니다.

조금 더 쉽게 카카오 로그인 구현하세요.

developer-fury.tistory.com/67

[Swift] 카카오 로그인 v2 사용하기!

 

 

Record
작성일	2019. 08. 21 (수) 2020. 06. 23(화)
Swift 버전	Swift 5
Xcode 버전	10.3 11.5

 

안녕하세요 Fury입니다 :]

네아로에 이어 Kakao Login in Swift를 진행해 보도록 하겠습니다~

(짝짝짝짝)

 

자 그럼, 시작해 보도록 하겠습니다.

 

1. Kakao Developers Site

 

먼저 카카오 개발자 사이트에 들어가 보죠~

 

https://developers.kakao.com/docs/ios/getting-started

Kakao Developers_

 

아 ~ 확인해보면 코드들이 objective-C로 작성된 것을 볼 수 있어요.

왜 API 문서들이 다 objective-C이고..

Swift로는 작성을 안 해주는 것인가..ㅠㅠ

kakao는 pod도 지원해주지 않네요.ㅠㅠㅠㅠ

(아니면 내가 못 찾은 거던가..)

 

일단,

아래 링크를 클릭해서 sdk를 받아주세요.

 

https://developers.kakao.com/docs/latest/ko/sdk-download/ios-v1

Kakao Developers

 

 

[2020. 06. 23(화) 추가 내용]

아래 사이트를 가면 v2를 확인 할 수 있습니다.

v2는 rx기반으로 작성된 SDK인 것 같네요.

4월 22일 기준 베타 4버전까지 나와있습니다.

궁금하신 분들은 한 번 살펴보는 것도 좋을 것 같아요ㅎㅎ

 

https://developers.kakao.com/docs/latest/ko/sdk-download/ios

Kakao Developers

 

그러면 다시 본론으로 돌아와서

다운로드한 SDK 압축 파일을 압축 해제해주세요.

그러면 아래 그림처럼 여러가지 프레임워크들이 있을 거에요.

 

 

카카오 로그인은

"KakaoOpenSDK.framework" 파일에

들어있습니다.

 

위의 파일을 프로젝트에 import 해주세요.

 

 

가이드를 보면서 따라 하시던 분들은

"왜 Framworks 폴더가 가이드 사진에는 있는데 우리 프로젝트에는 없지??"

라는 의문을 가지실 거예요 아마도...?

 

따로 추가된 프레임워크가 아직 없기때문에 그렇습니다!

 

자 다시, 그렇다면 우리는 어떻게 해야 하냐??

아래의 위치로 이동해서

 

"Linked Frameworks and Libraries"에 +버튼을 눌러주세요.

 

 

그리고 add Other... 버튼을 누른 후,

좀 전에 받은 SDK 압축 해제한 폴더를 찾아들어가세요.

그러면 "KakaoOpenSDK.framework"라는 프레임워크가 보일 거예요.

Open 해주세요.

 

 

그러면

왼쪽에 Frameworks 폴더도 생긴 것을 확인할 수 있네요.

그리고 그 안에 "KakaoOpenSDK.framework" 파일이 들어 있어요.

 

 

Build Phases 쪽에도 잘 들어간 것을 확인해주세요~

 

 

자 이제, Other Linker Flags에 "-all_load"를 추가할 거예요.

Build Settings 탭으로 이동하신 다음에

All 탭을 클릭하시고 "Other Linker"를 검색해주세요.

 

그리고 아래 그림처럼 "-all_load"를 추가해주세요.

추가할 때는 Other Linker Falgs를 더블 클릭하시면 오른쪽 조그만 창이 열려요.

다음 + 버튼을 누르고 문장을 추가하시면 끝~

 

 

가이드에 따르면 이로써 기본 세팅은 끝났다고 해요.

후우.. 엄청 뭔가 한 거 같은데 이제 기본 세팅이 끝이네요.

 

다음으로 앱 생성하기를 하도록 하겠습니다.

 

2. 앱 생성하기

 

먼저, 카카오 개발자 사이트에서 "내 애플리케이션 > 애플리케이션 추가하기"로 이동해요.

아이콘, 앱 이름, 회사명을 입력해주세요.

(앱 아이콘은 꼭 지금 없어도 괜찮아요)

 

 

아! 앱 이름에는 kakao가 들어갈 수 없습니다!

저도 처음에 kakaoLogin으로 했다가 바꿨어요..

 

그리고 나서 왼쪽 메뉴 바의

앱 설정 화면을 보시면

"플랫폼" 이라는 것이 보일거에요.

 

 

들어오시면 아래와 같은 화면이 나타납니다.

 

 

"iOS 플랫폼 등록" 버튼을 눌러주세요.

번들 ID가 어디 있는지는 아시리라 믿습니다~!!

그리고 나머지는 필수 사항은 아닙니다~

 

3. 프로젝트 내 앱 설정

 

이제, 프로젝트 내 앱 설정을 시작해 볼게요.

 

먼저, URL Types 항목을 추가해야 된다고 하네요.

KAKAO_APP_KEY를 입력하는 건데 그 앞에 "kakao"라는 문자열을 붙여서 등록하래요.

"kakao"라는 문자열을 붙여서!!!

 

여기서 KAKAO_APP_KEY는 아까 여러 가지 키 값들 중에서

"네이티브 앱 키"를 말하는 거예요.

(내 애플리케이션 -> 앱 설정 -> 앱 키)

 

공식 문서에도 사진이 잘 나와 있네요.

 

 

다음으로, info.plist 파일을 수정할 거예요.

 

 

요롷다고 하니깐

"KAKAO_APP_KEY"라는 이름의 Key를 추가하고

Type은 String인 Value는 네이티브 앱 키 값으로 등록을 해주세요.

 

여기에는 "kakao"라는 문자열을 앞에 안 붙여 주셔도 돼요.

그냥 순수 네이티브 앱 키 값을 입력해주세요.

 

그리고 아래 그림을 보면 혼동할 수도 있는데 "Information Property List" 바로 아래 만들어 주는 거예요.

얼핏 보면 URL types의 하위 목록처럼 보일 수 있어서 하는 말입니당~

 

 

추가 설정을 위해 info.plist 파일을  Source Code로 열어주세요.

이게 훨씬 쉬워요 작성하기가..

 

 

그런 다음 아래의 코드를 추가로 입력해주세요.

이건 참 가이드에 예시가 잘 들어져 있어서 따라 하기가 쉽네요 ㅎㅎ

 

저 중에서 "<!-- 공통 -->"으로 주석 처리되어 있는 부분은

"kakao" 문자열을 붙인 본인의 네이티브 앱 키를 작성해주세요.

 

 

이렇게 해줬다면!!

 

찐막!!!

Bridging_Header를 만들어줘야 해요!!

framework를 위해 받았던 폴더를 열어보면 samples 폴더가 있을 거예요.

그 안을 들어가 보면 swift 폴더가 있고

그 안에 "KakaoOpenSDK-Bridging-Hedaer.h" 파일이 있어요.

프로젝트에 넣어주세요.

 

정리하자면,

samples -> swift -> KakaoSample 폴더에

"KakaoOpenSDK-Bridging-Hedaer.h" 파일이 존재

이 파일을 프로젝트에 추가

 

 

찐찐막!!

진짜 더 없어요 이제!!

있으면 내가 개발자 안 함!! ㅋㅋㅋㅋ

 

Bridging Header를 연결해줘야 합니다.

아래와 같이 이동하여

"KakaoOpenSDK-Bridging-Header.h"를 입력해주세요.

 

그럼 끝!!!!!

 

코드 작성할 준비가 끝났다는 거예요!! ㅋㅋㅋㅋㅋㅋㅋㅋ

 

아, 여기서 잠깐!!

분명 위에 시키는 대로 다 했는데 

"KakaoOpenSDK/KakaoOpenSDK.h file not found" 에러가 계속 뜬다면????

아래와 같이 작업해주세요.

 

Frmaeworks 폴더의 카카오 SDK 완전 삭제하신 다음 -> Frmaeworks 폴더는 남아있으니 다시 SDK를 복사해서 넣으세요! (Copy items if needed 체크!)

 

4. Code 작성

 

먼저, AppDelegate 부분을 작성해 줄게요.

 

 

rootViewController를 LoginViewContoller()로 하고 있고요.

KOSession.handleOpen(url)을 통해서 카카오톡 로그인 페이지가 뜰 수 있도록 해주고 있어요.

 

여기서 따로 토큰 처리는 해주고 있지 않아요.

만약, 토큰을 활용해서 세션 여부에 따라 보이는 화면이 달라져야 한다면

그 처리 또한 AppDelegate에서 해주면 돼요~~

 

[20. 06. 23(화) 추가 내용]

카카오 로그인 역시 iOS 13으로 넘어가면서

씬 델리게이트를 처리해 줘야 합니다.

 

 

 

다음으로는 LoginViewController를 살펴볼게요.

 

 

가장 먼저 로그인 버튼을 만들어 주고 있어요!

 

네이버는 버튼 이미지만을 제공하는 반면에

"KOLoginButton"을 제공하고 있어서

카카오 고유의 노란 버튼을 사용할 수 있어요.

 

(혹시 네이버도 제공하고 있다면 좀 알려주세요..ㅠㅠ)

 

그리고 버튼이 눌렸을 때 동작할 함수를 작성하고 있습니다.

 

KOSession의 shared()를 통해서 싱글톤 객체를 생성하고요.

혹시나 세션이 열려있다면

닫아줍니다.

 

왜냐하면 로그인 버튼이 클릭된 것이니까요!!

세션이 열려있는 게 이상하긴 하죠?

 

제가 이상하다고 말씀드린 것은

세션이 열려있다면 로그인 화면이 띄어질 이유가 없기 때문입니다!!

 

다음으로 KOSession이 이제 막 열렸을 때,

error를 처리하고요.

error가 없다면

KOSessionTask.userMeTask를 통해서 사용자 정보를 가져올 수 있어요.

 

저는 email과 nickname을 가져오고 있습니다~

 

그 정보들을 mainViewController의 Label들에게 부여하고 있어요.

진짜 들어오는지 봐야 알 수 있으니까요?ㅋㅋㅋ

 

자 그럼 대망의 MainViewController입니다!!

 

 

별거 없어요..

그냥 email과 nicname을 띄어주기 위한 label들이 존재해요.

 

그리고 로그아웃 버튼이 존재하는데!!

KOSession의 logoutAndClose를 호출하면서

호출이 성공적으로 이루어지면 dismiss 하고 있습니다.

 

logoutAndClose가 호출되면 세션이 끊기도록 되어 있어요.

로그아웃을 구현하는 것도 쉽게 되어 있네요 ㅎㅎ

 

이렇게 Kakao로 로그인하기 및 로그아웃까지 알아봤는데요.

여기서 더 중요한 건 이 토큰들을 어떻게 관리할지가 되겠네요.ㅎㅎ

 

카카오 포스팅은 여기까지 입니다.

감사합니다 :]