How to Implement Apple Sign-In with Kotlin/Wasm
Step-by-step guide for Firebase and Apple Developer Portal integration.
1Prerequisites for Apple Sign-In
Enabling the Apple provider in the Firebase console is not enough. You need to create a Services ID, your Apple team ID, a Key ID, and a .p8 private key in the Apple Developer portal. Additionally, register your Firebase auth handler URL as a return URL on the Services ID. Each missing field results in an auth/operation-not-allowed error without specifying which part is missing.
2Firebase Binding Structure
Part 1 only supported GoogleAuthProvider in firebase/auth bindings. For Apple sign-in, Firebase's generic OAuthProvider needs to be added. Both provider classes extend Firebase's AuthProvider on the JS side, and JsAny allows one binding to accept both. This requires only a small change in the code.
3Helper Function for Popup Sign-In
Since both providers now share the same popup, the then/catch logic from part 1 was moved to a small helper function. This function returns the user's display name, email, or uid on successful sign-in. On failure, it logs the error and notifies the user. This reduces code duplication and simplifies maintenance.
4Core Code for Apple Sign-In
For Apple sign-in, OAuthProvider('apple.com') is used with email and name scopes added. This structure is very similar to the Kotlin/JS version. Using the expect/actual pattern, it can be called from any button in shared Compose code. The popup redirects to appleid.apple.com, with the same nullable-displayName caveat as Google sign-in.
5Name Sharing from Apple
Apple only shares the name during the very first authorization. For subsequent sign-ins, the user's email or uid is used. This is a detail developers need to account for to ensure a consistent user experience. A fallback mechanism should be implemented in the app to handle this scenario.
6GitLive and Firebase-Kotlin-SDK
GitLive's Firebase-Kotlin-SDK serves as a blueprint for these bindings. The sample repo also runs the same shared UI natively on iOS. This is a significant advantage for cross-platform developers. If you're looking for a guide on Apple sign-in for iOS, you can leave a comment.
7Cross-Platform Advantage with Kotlin/Wasm
Kotlin/Wasm enables code sharing between web and mobile platforms. In this example, the same auth logic works on both web and iOS. This reduces development time and ensures consistency. Firebase bindings enhance Kotlin's multiplatform capabilities.
8Conclusion and Recommendations
Integrating Apple sign-in with Kotlin/Wasm is straightforward once Firebase and the Apple Developer Portal are correctly configured. Using OAuthProvider and JsAny flexibility simplifies multi-provider support. Developers should consider the name sharing on first sign-in and implement fallback mechanisms to improve user experience.
Original article: ProAndroidDev - Medium — Kotlin/Wasm ile Apple Girişi Nasıl Yapılır?