SwiftUI 카카오 로그인 연동

카카오 로그인

보통 사이드 프로젝트로 앱을 개발하는 경우 카카오, 구글 네이버, 애플 아이디 등을 사용하여
로그인 기능을 제공하는 경우가 많다. 나도 처음으로 SwiftUI를 사용하여 카카오 로그인을 시도해봤다.

우선 첫 번째!
1. 카카오 Developers에 등록하기

• 먼저 앱을 생성하고 생성하고 iOS 탭으로 이동하여 플랫폼을 등록한다
  - 이 때는 xcode의 번들 아이디가 필요하다! -> 앱 확인용
  • 이 때 제품설정에서 카카오 로그인을 활성화 해줘야한다.
  • 이후 카카오 로그인 통해 얻을 수 있는 정보도 설정해야 한다!

나의 경우 해당 과정은 Back에서 진행을 해줬다.(고맙습니다😎)

2. 카카오 SDK 설치

• 다행이 Swift Pakage Manager에서 설치가 가능하다!

  https://github.com/kakao/kakao-ios-sdk

• 여기서 필요한 모듈만 선택한다
  - 카카오 로그인만 한다면 == KakaoSDKAuth, KakaoSDKCommon, KakaoSDKUser
  

3. info.plist 설정

• info -> Custom iOS Target Properties 에서 Queried URL Schema 추가
  (Kakaokompassauth, kakaolink)
• URL type을 통해 URL Scheme 추가! -> 여기서 Schemes에 Kakao Developers의 네이팁 앱 키 등록

  Kakao{네이티브 앱 키}

4. 초기화

   [프로젝트이름]App.swift 파일에 Kakao SDK 초기화 코드 작성

import SwiftUI
import KakaoSDKCommon
import KakaoSDKAuth

@main
struct AppnameApp: App {
    init() {
        KakaoSDK.initSDK(appKey:"{native app key}")
    }
    
    var body: some Scene {
        WindowGroup {
            LoginView()
            	.onOpenURL { url in
                    if (AuthApi.isKakaoTalkLoginUrl(url)) { 
                    	_ = AuthController.handleOpenUrl(url: url) 
                    }
                }
        }
    }
}

5. 실제 사용 위한 버튼 추가

import SwiftUI
import KakaoSDKCommon
import KakaoSDKAuth
import KakaoSDKUser

struct KakaoLoginView: View{
    var body: some View{
        Button {
            if (UserApi.isKakaoTalkLoginAvailable()) {
                UserApi.shared.loginWithKakaoTalk {(oauthToken, error) in
                    if let error = error {
                        //에러처리
                    }
                    if let oauthToken = oauthToken{
                        //로그인 API 호출
                    }
                }
            } else {
                UserApi.shared.loginWithKakaoAccount {(oauthToken, error) in
                    if let error = error {
                        //에러처리
                    }
                    if let oauthToken = oauthToken{
                        //회원가입 API 호출
                    }
                }
            }
        } label : {
            Image("원하는 이미지")
        }
    }
}

소셜 로그인에 처음으로 도전해보았다. 우선은 해당 소셜 앱에 앱을 등록하는 것 부터가 신기한 경험이었다.
이후 앱 설정 바꿔가며 무엇인가 만들어 내는 것이 재미있는 경험이었다.
하지만 이후 실제 View를 통해서 API를 호출할 수 있도록 하는 과정에서 아직 해당 함수들에 대한 이해가 낮아 어려움이 있었지만, 카카오 공식 문서를 통해 해결할 수 있었다. 공식 문서에 각 언어 환경별 가이드가 명확이 나와있어 이 부분은 공식 문서를 잘 살펴보면 다양한 어려움을 극복할 수 있을 것 같다.