[Flutter] Flutter iOS 카카오 로그인 연동 시 stuck 문제 해결 팁

Flutter 앱에 카카오 로그인을 연동하는 것은 사용자 경험을 향상시키고 사용자 기반을 확장하는 좋은 방법입니다. 하지만 iOS 환경에서 UserApi.instance.loginWithKakaoTalk()을 사용하여 카카오톡으로 로그인할 때 앱이 stuck되는 문제가 발생할 수 있습니다. 이 글에서는 이러한 문제를 해결하는 팁을 공유합니다.

문제 원인

이 문제는 주로 iOS 네이티브 코드에서 카카오 SDK가 제대로 초기화되지 않았거나, 카카오톡 로그인 URL 처리가 누락되었을 때 발생합니다.

해결 방법

AppDelegate.swift 수정:

ios/Runner/AppDelegate.swift 파일을 열고 다음과 같이 코드를 수정합니다.
Swift

import KakaoSDKAuth // 필수 추가
import KakaoSDKCommon // 필수 추가
import Foundation
import UIKit
import Flutter
import GoogleMaps
import FBSDKCoreKit
import app_links

@main
@objc class AppDelegate: FlutterAppDelegate {
override func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
// Firebase 초기화
FirebaseApp.configure()
// 카카오 SDK 초기화
KakaoSDK.initSDK(appKey: "YOUR_NATIVE_APP_KEY") // 카카오 네이티브 앱 키 입력

ApplicationDelegate.shared.application(
  application,
  didFinishLaunchingWithOptions: launchOptions
)

GeneratedPluginRegistrant.register(with: self)

AppEvents.shared.activateApp()
return super.application(application, didFinishLaunchingWithOptions: launchOptions)

}

// application(:open:options:) 메서드 통합
override func application(
app: UIApplication,
open url: URL,
options: [UIApplication.OpenURLOptionsKey : Any] = [:]
) -> Bool {
// Facebook URL 처리
if ApplicationDelegate.shared.application(app, open: url, options: options) {
return true
}

  // KakaoTalk 로그인 URL 처리
  if AuthApi.isKakaoTalkLoginUrl(url) {
      return AuthController.handleOpenUrl(url: url)
  }

  // 기본 처리
  return super.application(app, open: url, options: options)

}
}

YOUR_NATIVE_APP_KEY를 카카오 개발자 웹사이트에서 확인한 네이티브 앱 키로 변경합니다.
import KakaoSDKAuth와 import KakaoSDKCommon을 추가하여 카카오 SDK를 import 합니다.(KakaoSDKAuth만 추가했을때는 해결이 안됐는데 KakaoSDKCommon도 같이 추가하니 문제가 저는 해결됐습니다)
KakaoSDK.initSDK(appKey: "YOUR_NATIVE_APP_KEY")를 추가하여 카카오 SDK를 초기화합니다.

• YOUR_JAVASCRIPT_APP_KEY를 카카오 개발자 웹사이트에서 확인한 JavaScript 앱 키로 변경합니다.
  주의사항:

카카오 개발자 웹사이트에서 앱 설정이 올바르게 되었는지 확인합니다.
네이티브 앱 키와 JavaScript 앱 키를 올바르게 입력했는지 확인합니다.
iOS 시뮬레이터 또는 실제 기기에서 테스트합니다.
카카오톡 앱이 설치되어 있지 않은 경우 카카오 계정으로 로그인됩니다.
카카오톡 버전 및 카카오 SDK 버전에 따라 코드가 달라질 수 있습니다. 최신 문서를 참고하세요.
추가 팁:

카카오톡 앱이 최신 버전인지 확인합니다.
Xcode에서 Clean Build Folder를 실행하고 다시 빌드합니다.
실제 기기에서 테스트할 경우, 기기의 네트워크 연결 상태를 확인합니다.
위 단계를 따르면 iOS 환경에서 UserApi.instance.loginWithKakaoTalk()을 사용하여 카카오톡으로 로그인할 때 발생하는 stuck 문제를 해결할 수 있습니다.