[iOS/Swift] 카카오톡 소셜 로그인 구현하기

iOS 에서 카카오 소셜 로그인을 구현해 봅시다~!

지난주에 잠깐 깔짝거렸을 때는 어려워 보였는데.. 안 피곤할 때 차분히 공식문서 읽으니 의외로 간단하게 구현했다.

 

카카오 공통 가이드 👇

developers.kakao.com/docs/latest/ko/kakaotalk-social/common#request-permission

Kakao Developers

카카오 소셜 API 를 사용하려면 

1. [내 애플리케이션] > [카카오 로그인] > [동의 항목] 설정
2. 친구 목록 가져오기 API 사용 권한 받기

위 두 가지 사전 준비가 필요하다고 합니다. 차분히 시작해 봅시당

---

애플리케이션 등록

developers.kakao.com/docs/latest/ko/getting-started/app

Kakao Developers

위 공식문서에서 하란 대로 그대로 따라해 줍니다.

 

 

어플리케이션 추가

앱 아이콘, 앱 이름, 회사 이름을 작성해 저장을 누르면

앱 키

자동으로 네이티브앱키, RestAPI 키, JavaScript 키, Admin 키가 발급됩니다. 잘 기억해 둡시다!

 

여러가지 항목을 설정할 수 있지만, 카카오 로그인 동의 항목 설정을 하겠습니다.

먼저 로그인 활성화 창에서 ON 을 누릅니다.

 

카카오 로그인 활성화

그리고 제품설정 > 동의항목 을 누르면 원하는 동의 항목들을 설정할 수 있습니다.

개인정보 보호 항목

 

동의창 미리보기를 누르면 미리 볼 수도 있습니다. 현재는 프로필 정보와 카카오 계정만 선택으로 둔 상태입니다.

---

설치하기

developers.kakao.com/docs/latest/ko/getting-started/sdk-ios

Kakao Developers

pod 'KakaoSDK'

먼저 pod install 을 해줍니다.

 

그리고 Info.plist 에서 LSApplicationQueriesSchemes 를 추가합니다. 

 <key>LSApplicationQueriesSchemes</key>
  <array>
      <!-- 카카오톡으로 로그인 -->
      <string>kakaokompassauth</string>
      <!-- 카카오링크 -->
      <string>kakaolink</string>
  </array>

 

앱 실행을 위한 URL Scheme 설정을 해 줍니다. Info > URLTypes > URL Schemes 항목에 아까 앞서 발급한 네이티브 앱 키를 입력합니다.

이 때 네이티브 앱 키 앞에 kakao 를 붙여서 작성합니다.

url scheme

iOS 앱에서 iOS SDK를 사용하려면 iOS SDK 파일을 아래와 같이 임포트(import)해야 합니다. 또한 네이티브 앱 키를 사용해 iOS SDK를 초기화하는 과정이 필요합니다. 다음 예제를 참고하여 AppDelegate.swift에 Kakao SDK를 초기화하는 코드를 추가합니다.

import KakaoSDKCommon

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {

  ...
  KakaoSDKCommon.initSDK(appKey: "NATIVE_APP_KEY")
  ...

}

---

로그인

드디어! 이제 로그인 시작합시다.

developers.kakao.com/docs/latest/ko/kakaologin/ios

Kakao Developers

카카오톡으로 로그인은 서비스 앱에서 카카오톡으로 이동한 후, 사용자가 '동의하고 계속하기' 버튼 또는 로그인 취소 버튼을 누르면 다시 카카오톡에서 서비스 앱으로 이동하는 과정을 거칩니다. 카카오톡에서 서비스 앱으로 돌아왔을 때 카카오 로그인 처리를 정상적으로 완료하기 위해 AppDelegate.swift 파일에 다음 코드를 추가해야 합니다.

import KakaoSDKAuth
...

class AppDelegate: UIResponder, UIApplicationDelegate {
    ...
    func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
        if (AuthApi.isKakaoTalkLoginUrl(url)) {
            return AuthController.handleOpenUrl(url: url)
        }

        return false
    }
    ...
}

 

카카오톡으로 로그인 API인 loginWithKakaoTalk()를 호출합니다. 이때 isKakaoTalkLoginAvailable()로 카카오톡 설치 여부를 확인할 수 있습니다.

카카오톡으로 로그인 API가 호출되면 iOS SDK가 카카오톡을 실행시키고 사용자에게 앱 이용 관련 동의를 구하는 동의 화면을 출력합니다. API 호출 시 결과 처리를 클로저(Closure) 객체로 정의하여 전달해야 합니다.

// 카카오톡 설치 여부 확인
if (AuthApi.isKakaoTalkLoginAvailable()) {
    AuthApi.shared.loginWithKakaoTalk {(oauthToken, error) in
        if let error = error {
            print(error)
        }
        else {
            print("loginWithKakaoTalk() success.")

            //do something
            _ = oauthToken            
        }
    }    
}

위 코드는 카카오톡 어플로 로그인을 하는 코드입니다.

 

현재 저는 시뮬레이터밖에 없어서 ㅠㅠ 웹뷰로 로그인하는 것을 테스트 해보겠습니다.

AuthApi.shared.loginWithKakaoAccount {(oauthToken, error) in
        if let error = error {
            print(error)
        }
        else {
            print("loginWithKakaoAccount() success.")            

            //do something
            let _ = oauthToken            
        }
    }

 

성공~!~!~!