【Compose Multiplatform】KMPAuthを使用したFirebaseソーシャルログイン(iOS編)
みなさんこんにちは。今回はCompose Multiplatform入門記事第6回目ということで、Firebaseと連携してソーシャルログインを実装していきます。
前回Androidでのソーシャルログインを実装したので、今回はiOSをやっていきます。
これまでのCompose Multiplatform記事はこちら
Compose Multiplatform入門(環境構築編)
Compose Multiplatform入門(プロジェクト作成編)
Compose Multiplatform入門(画面遷移編)
Compose Multiplatform入門(ロギング編)
KMPAuthを使用したFirebaseソーシャルログイン(Andorid編)
iOSでのSNSログイン
KMPAuthのREADMEにもある通り、iOSでソーシャルログインを実装するには別途準備が必要になります。Firebaseアプリケーションの登録
Firebaseのコンソールから、iOSアプリの登録を行います。 アプリケーションIDの登録をすると、GoogleService-Info.plistファイルが生成されるので、こちらをダウンロードしてiosApp/iosApp フォルダ内に入れます。また、もともと入っているInfo.plistファイルも更新が必要です。以下のテキストを追加しましょう。クライアントIDなどは適宜置き換えてください。ダウンロードしたGoogleService-Info.plistファイルに書かれています。
<key>GIDServerClientID</key>
<string>YOUR_SERVER_CLIENT_ID</string>
<key>GIDClientID</key>
<string><YOUR_IOS_CLIENT_ID</string>
<key>CFBundleURLTypes<key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>YOUR_DOT_REVERSED_IOS_CLIENT_ID</string>
</array>
</dict>
</array>
パッケージのインストール
まずはXcodeを使用してパッケージを取得していきます。XcodeでiosAppフォルダ内のiosApp.xcodeprojファイルを開き、FirebaseSDKとGoogleSignInのパッケージを取得します。 「File」タブの「Add Package Dependencies...」から「googlesignin-ios」と「firebase-ios-sdk」を検索して追加します。
iosApp/iosApp/iOSApp.swiftの更新
READMEにもiOSApp.swiftの更新をするよう書かれていますが、READMEのコード丸写しだと動きません。少し修正が必要です。
import ComposeApp
import FirebaseCore
import GoogleSignIn
import SwiftUI
class AppDelegate: NSObject, UIApplicationDelegate {
func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil
) -> Bool {
FirebaseApp.configure()
AppInitializer.shared.onApplicationStart()
return true
}
func application(
_ app: UIApplication,
open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]
) -> Bool {
var handled: Bool
handled = GIDSignIn.sharedInstance.handle(url)
if handled {
return true
}
// Handle other custom URL types.
// If not handled by this app, return false.
return false
}
}
@main
struct iOSApp: App {
@UIApplicationDelegateAdaptor(AppDelegate.self) var delegate
var body: some Scene {
WindowGroup {
ContentView().onOpenURL(perform: { url in
GIDSignIn.sharedInstance.handle(url)
})
}
}
}
MainViewControllerの更新
iOSのほうでも、AppInitializer.onApplicationStart()を呼んでおきます。
import androidx.compose.ui.window.ComposeUIViewController
fun MainViewController() = ComposeUIViewController(configure = {
AppInitializer.onApplicationStart()
}) { App() }
不具合の修正
ここまでやって準備は完了なのですが、KMPAuthのIssueに、iOSのときにMissingResourceExceptionが発生するという問題が記載されていたので、その対処を行います。リソースの追加
Isuueのリンク先にあるように、composeApp/src/iosMain内に「resources」フォルダを追加します。build.gradle.ktsの更新
iosMainのところにsrcDirsを記載します。
iosMain {
resources.srcDirs("src/commonMain/composeResources","src/iosMain/resources")
dependencies {
implementation(libs.stately.common)
}
}
これで全ての修正が完了...したかに思いましたが、まだ動作しませんでした。
KMPAuthのバージョンを調整
KMPAuthのバージョンが2.0.0だとうまく動きませんでした。追加したはずのresourcesが認識されず、MissingResourceExceptionになってクラッシュしてしまいました。
Uncaught Kotlin exception: org.jetbrains.compose.resources.MissingResourceException: Missing resource with path: <参照しようとしていたPath>
Androidでは動いていたので大丈夫かと思っていましたが、どうやら罠だったようです。 バージョン1.4.0だと動作したので、バージョンを下げておきます。 libs.versions.tomlを更新します。
kmp-auth = "1.4.0"
これでiOSでもFirebaseでGoogleアカウントログインが実装できました。 ボタンを押してGoogleのログイン処理を終えた後に、アカウントの名前が表示されれば成功です。