|
| 1 | +# FirebaseUI for SwiftUI |
| 2 | + |
| 3 | +FirebaseUI for SwiftUI is a library built on top of Firebase Authentication that provides modern, SwiftUI-first sign-in flows for your app. |
| 4 | + |
| 5 | +FirebaseUI for SwiftUI provides the following benefits: |
| 6 | + |
| 7 | +- Opinionated default UI: add a complete sign-in flow with `AuthPickerView`. |
| 8 | +- Customizable: use the built-in flow, render the default buttons in your own layout, or build a fully custom experience with `AuthService`. |
| 9 | +- Anonymous account linking: optionally upgrade anonymous users instead of replacing them. |
| 10 | +- Account management: built-in flows for sign-in, sign-up, password recovery, email link sign-in, reauthentication, and account management. |
| 11 | +- Multiple providers: email/password, email link, phone authentication, Apple, Google, Facebook, Twitter, and generic OAuth/OIDC providers. |
| 12 | +- Modern auth features: built-in support for multi-factor authentication (MFA) and async/await APIs. |
| 13 | + |
| 14 | +## Before you begin |
| 15 | + |
| 16 | +FirebaseUI authentication is now delivered as Swift Package Manager packages for SwiftUI apps. |
| 17 | + |
| 18 | +1. Add Firebase to your Apple project by following the [Firebase iOS setup guide](https://firebase.google.com/docs/ios/setup). |
| 19 | +2. In Xcode, choose **File > Add Package Dependencies...** |
| 20 | +3. Add `https://github.com/firebase/FirebaseUI-iOS` |
| 21 | +4. Select `FirebaseAuthSwiftUI` and any provider packages you want to use: |
| 22 | + - `FirebaseAppleSwiftUI` |
| 23 | + - `FirebaseGoogleSwiftUI` |
| 24 | + - `FirebaseFacebookSwiftUI` |
| 25 | + - `FirebasePhoneAuthSwiftUI` |
| 26 | + - `FirebaseTwitterSwiftUI` |
| 27 | + - `FirebaseOAuthSwiftUI` |
| 28 | +5. Make sure your app targets iOS 17 or later. |
| 29 | + |
| 30 | +Then configure Firebase when your app launches: |
| 31 | + |
| 32 | +```swift |
| 33 | +import FirebaseAuthSwiftUI |
| 34 | +import FirebaseCore |
| 35 | +import SwiftUI |
| 36 | + |
| 37 | +class AppDelegate: NSObject, UIApplicationDelegate { |
| 38 | + func application( |
| 39 | + _ application: UIApplication, |
| 40 | + didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil |
| 41 | + ) -> Bool { |
| 42 | + FirebaseApp.configure() |
| 43 | + return true |
| 44 | + } |
| 45 | +} |
| 46 | + |
| 47 | +@main |
| 48 | +struct YourApp: App { |
| 49 | + @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate |
| 50 | + |
| 51 | + var body: some Scene { |
| 52 | + WindowGroup { |
| 53 | + ContentView() |
| 54 | + } |
| 55 | + } |
| 56 | +} |
| 57 | +``` |
| 58 | + |
| 59 | +## Set up sign-in methods |
| 60 | + |
| 61 | +Before you can sign users in, enable the providers you want to support in **Authentication > Sign-in method** in the Firebase console. |
| 62 | + |
| 63 | +### Email address and password |
| 64 | + |
| 65 | +Enable the **Email/Password** provider in the Firebase console. |
| 66 | + |
| 67 | +Add email sign-in to your `AuthService`: |
| 68 | + |
| 69 | +```swift |
| 70 | + let authService = AuthService() |
| 71 | + .withEmailSignIn() |
| 72 | +``` |
| 73 | + |
| 74 | +### Email link authentication |
| 75 | + |
| 76 | +To use passwordless email link sign-in, configure `ActionCodeSettings` and pass it into `AuthConfiguration`. |
| 77 | + |
| 78 | +```swift |
| 79 | +let actionCodeSettings = ActionCodeSettings() |
| 80 | +actionCodeSettings.handleCodeInApp = true |
| 81 | +actionCodeSettings.url = URL(string: "https://yourapp.firebaseapp.com") |
| 82 | +actionCodeSettings.setIOSBundleID(Bundle.main.bundleIdentifier!) |
| 83 | + |
| 84 | +let configuration = AuthConfiguration( |
| 85 | + emailLinkSignInActionCodeSettings: actionCodeSettings |
| 86 | +) |
| 87 | + |
| 88 | +let authService = AuthService(configuration: configuration) |
| 89 | + .withEmailSignIn() |
| 90 | +``` |
| 91 | + |
| 92 | +You must also: |
| 93 | + |
| 94 | +1. Enable **Email link (passwordless sign-in)** in the Firebase console. |
| 95 | +2. Add the link domain to **Authorized domains**. |
| 96 | +3. If you build custom views, call `authService.handleSignInLink(url:)` when the link opens your app. |
| 97 | + |
| 98 | +### Apple |
| 99 | + |
| 100 | +To use Sign in with Apple: |
| 101 | + |
| 102 | +1. Enable **Apple** in the Firebase console. |
| 103 | +2. Add the **Sign in with Apple** capability in Xcode. |
| 104 | +3. Follow the Firebase guide for [Sign in with Apple on Apple platforms](https://firebase.google.com/docs/auth/ios/apple). |
| 105 | + |
| 106 | +Then register the provider: |
| 107 | + |
| 108 | +```swift |
| 109 | + let authService = AuthService() |
| 110 | + .withAppleSignIn() |
| 111 | +``` |
| 112 | + |
| 113 | +### Google |
| 114 | + |
| 115 | +To use Google Sign-In: |
| 116 | + |
| 117 | +1. Enable **Google** in the Firebase console. |
| 118 | +2. Follow the Firebase guide for [Google Sign-In on Apple platforms](https://firebase.google.com/docs/auth/ios/google-signin). |
| 119 | +3. Add your `REVERSED_CLIENT_ID` from `GoogleService-Info.plist` to **URL Types** in your Xcode target. |
| 120 | + |
| 121 | +Then register the provider: |
| 122 | + |
| 123 | +```swift |
| 124 | + let authService = AuthService() |
| 125 | + .withGoogleSignIn() |
| 126 | +``` |
| 127 | + |
| 128 | +### Facebook |
| 129 | + |
| 130 | +To use Facebook Login: |
| 131 | + |
| 132 | +1. Enable **Facebook** in the Firebase console and add your Facebook App ID and App Secret. |
| 133 | +2. Follow Facebook's iOS SDK setup instructions. |
| 134 | +3. Add `fb{your-app-id}` to **URL Types** in your Xcode target. |
| 135 | +4. Add `FacebookAppID` and `FacebookDisplayName` to `Info.plist`. |
| 136 | +5. Enable Keychain Sharing in Xcode. |
| 137 | + |
| 138 | +Then register the provider: |
| 139 | + |
| 140 | +```swift |
| 141 | + let authService = AuthService() |
| 142 | + .withFacebookSignIn() |
| 143 | +``` |
| 144 | + |
| 145 | +### Phone number |
| 146 | + |
| 147 | +To use phone authentication: |
| 148 | + |
| 149 | +1. Enable **Phone** in the Firebase console. |
| 150 | +2. Configure APNs for your app. |
| 151 | +3. Enable Push Notifications in Xcode. |
| 152 | +4. Add your Firebase **Encoded App ID** as a URL scheme for reCAPTCHA fallback. |
| 153 | + |
| 154 | +If you use phone auth, add the notification and URL handlers Firebase Auth needs: |
| 155 | + |
| 156 | +```swift |
| 157 | +import FirebaseAuth |
| 158 | +import FirebaseCore |
| 159 | +import UIKit |
| 160 | + |
| 161 | +class AppDelegate: NSObject, UIApplicationDelegate { |
| 162 | + func application( |
| 163 | + _ application: UIApplication, |
| 164 | + didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil |
| 165 | + ) -> Bool { |
| 166 | + FirebaseApp.configure() |
| 167 | + return true |
| 168 | + } |
| 169 | + |
| 170 | + func application( |
| 171 | + _ application: UIApplication, |
| 172 | + didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data |
| 173 | + ) { |
| 174 | + Auth.auth().setAPNSToken(deviceToken, type: .prod) |
| 175 | + } |
| 176 | + |
| 177 | + func application( |
| 178 | + _ app: UIApplication, |
| 179 | + open url: URL, |
| 180 | + options: [UIApplication.OpenURLOptionsKey: Any] = [:] |
| 181 | + ) -> Bool { |
| 182 | + Auth.auth().canHandle(url) |
| 183 | + } |
| 184 | +} |
| 185 | +``` |
| 186 | + |
| 187 | +Then register the provider: |
| 188 | + |
| 189 | +```swift |
| 190 | + let authService = AuthService() |
| 191 | + .withPhoneSignIn() |
| 192 | +``` |
| 193 | + |
| 194 | +### Twitter |
| 195 | + |
| 196 | +To use Twitter Login: |
| 197 | + |
| 198 | +1. Enable **Twitter** in the Firebase console. |
| 199 | +2. Configure the provider credentials in Firebase. |
| 200 | + |
| 201 | +Then register the provider: |
| 202 | + |
| 203 | +```swift |
| 204 | + let authService = AuthService() |
| 205 | + .withTwitterSignIn() |
| 206 | +``` |
| 207 | + |
| 208 | +### Generic OAuth and OIDC providers |
| 209 | + |
| 210 | +FirebaseUI also supports built-in OAuth providers such as GitHub, Microsoft, and Yahoo, as well as custom OIDC providers configured in Firebase Authentication. |
| 211 | + |
| 212 | +```swift |
| 213 | + let authService = AuthService() |
| 214 | + .withOAuthSignIn(OAuthProviderSwift.github()) |
| 215 | + .withOAuthSignIn(OAuthProviderSwift.microsoft()) |
| 216 | + .withOAuthSignIn(OAuthProviderSwift.yahoo()) |
| 217 | +``` |
| 218 | + |
| 219 | +For custom OIDC providers, configure the provider first in Firebase Authentication, then create an `OAuthProviderSwift` with your provider ID and button configuration. |
| 220 | + |
| 221 | +### Handle provider callbacks |
| 222 | + |
| 223 | +If you use Google Sign-In, Facebook Login, phone authentication, or email link flows, add the required URL handling to your app delegate. |
| 224 | + |
| 225 | +```swift |
| 226 | +import FacebookCore |
| 227 | +import FirebaseAuth |
| 228 | +import GoogleSignIn |
| 229 | +import UIKit |
| 230 | + |
| 231 | +class AppDelegate: NSObject, UIApplicationDelegate { |
| 232 | + func application( |
| 233 | + _ app: UIApplication, |
| 234 | + open url: URL, |
| 235 | + options: [UIApplication.OpenURLOptionsKey: Any] = [:] |
| 236 | + ) -> Bool { |
| 237 | + if Auth.auth().canHandle(url) { |
| 238 | + return true |
| 239 | + } |
| 240 | + |
| 241 | + if ApplicationDelegate.shared.application( |
| 242 | + app, |
| 243 | + open: url, |
| 244 | + sourceApplication: options[.sourceApplication] as? String, |
| 245 | + annotation: options[.annotation] |
| 246 | + ) { |
| 247 | + return true |
| 248 | + } |
| 249 | + |
| 250 | + return GIDSignIn.sharedInstance.handle(url) |
| 251 | + } |
| 252 | +} |
| 253 | +``` |
| 254 | + |
| 255 | +## Sign in |
| 256 | + |
| 257 | +To start the FirebaseUI sign-in flow, create an `AuthService`, register the providers you want, and pass it into `AuthPickerView`. |
| 258 | + |
| 259 | +### Swift |
| 260 | + |
| 261 | +```swift |
| 262 | +import FirebaseAppleSwiftUI |
| 263 | +import FirebaseAuthSwiftUI |
| 264 | +import FirebaseGoogleSwiftUI |
| 265 | +import SwiftUI |
| 266 | + |
| 267 | +struct ContentView: View { |
| 268 | + let authService: AuthService |
| 269 | + |
| 270 | + init() { |
| 271 | + let configuration = AuthConfiguration( |
| 272 | + shouldAutoUpgradeAnonymousUsers: true, |
| 273 | + tosUrl: URL(string: "https://example.com/terms"), |
| 274 | + privacyPolicyUrl: URL(string: "https://example.com/privacy") |
| 275 | + ) |
| 276 | + |
| 277 | + authService = AuthService(configuration: configuration) |
| 278 | + .withEmailSignIn() |
| 279 | + .withAppleSignIn() |
| 280 | + .withGoogleSignIn() |
| 281 | + } |
| 282 | + |
| 283 | + var body: some View { |
| 284 | + AuthPickerView { |
| 285 | + authenticatedContent |
| 286 | + } |
| 287 | + .environment(authService) |
| 288 | + } |
| 289 | + |
| 290 | + var authenticatedContent: some View { |
| 291 | + NavigationStack { |
| 292 | + VStack(spacing: 20) { |
| 293 | + if authService.authenticationState == .authenticated { |
| 294 | + Text("Authenticated") |
| 295 | + |
| 296 | + Button("Manage Account") { |
| 297 | + authService.isPresented = true |
| 298 | + } |
| 299 | + .buttonStyle(.bordered) |
| 300 | + |
| 301 | + Button("Sign Out") { |
| 302 | + Task { |
| 303 | + try? await authService.signOut() |
| 304 | + } |
| 305 | + } |
| 306 | + .buttonStyle(.borderedProminent) |
| 307 | + } else { |
| 308 | + Text("Not Authenticated") |
| 309 | + |
| 310 | + Button("Sign In") { |
| 311 | + authService.isPresented = true |
| 312 | + } |
| 313 | + .buttonStyle(.borderedProminent) |
| 314 | + } |
| 315 | + } |
| 316 | + } |
| 317 | + .onChange(of: authService.authenticationState) { _, newValue in |
| 318 | + if newValue != .authenticating { |
| 319 | + authService.isPresented = (newValue == .unauthenticated) |
| 320 | + } |
| 321 | + } |
| 322 | + } |
| 323 | +} |
| 324 | +``` |
| 325 | + |
| 326 | +When you use `AuthPickerView`, FirebaseUI handles the default authentication flow for you, including: |
| 327 | + |
| 328 | +- Navigation between sign-in screens |
| 329 | +- Password recovery and email link flows |
| 330 | +- Account conflict handling |
| 331 | +- Reauthentication for sensitive operations |
| 332 | +- MFA resolution when enabled |
| 333 | + |
| 334 | +If you want more control, you can skip `AuthPickerView` and call `AuthService` methods directly from your own views. |
| 335 | + |
| 336 | +## Sign out |
| 337 | + |
| 338 | +FirebaseUI provides an async sign-out method: |
| 339 | + |
| 340 | +```swift |
| 341 | +Task { |
| 342 | + try await authService.signOut() |
| 343 | +} |
| 344 | +``` |
| 345 | + |
| 346 | +## Customization |
| 347 | + |
| 348 | +You can customize the authentication experience in a few different ways. |
| 349 | + |
| 350 | +Use `AuthConfiguration` to configure behavior such as: |
| 351 | + |
| 352 | +- Terms of service and privacy policy URLs |
| 353 | +- Custom localized strings bundle |
| 354 | +- Email link configuration |
| 355 | +- Anonymous user upgrades |
| 356 | +- MFA support |
| 357 | + |
| 358 | +```swift |
| 359 | +let configuration = AuthConfiguration( |
| 360 | + shouldAutoUpgradeAnonymousUsers: true, |
| 361 | + customStringsBundle: .main, |
| 362 | + tosUrl: URL(string: "https://example.com/terms"), |
| 363 | + privacyPolicyUrl: URL(string: "https://example.com/privacy"), |
| 364 | + mfaEnabled: true |
| 365 | +) |
| 366 | +``` |
| 367 | + |
| 368 | +If you want to keep the built-in buttons but use your own layout, call `authService.renderButtons()`. |
| 369 | + |
| 370 | +If you want a fully custom experience, build your own views and call methods such as: |
| 371 | + |
| 372 | +- `authService.signIn(_:)` |
| 373 | +- `authService.signIn(email:password:)` |
| 374 | +- `authService.createUser(email:password:)` |
| 375 | +- `authService.verifyPhoneNumber(phoneNumber:)` |
| 376 | +- `authService.signInWithPhoneNumber(verificationID:verificationCode:)` |
| 377 | + |
| 378 | +You can also register your own provider button by conforming to `AuthProviderUI` and calling `authService.registerProvider(providerWithButton:)`. |
| 379 | + |
| 380 | +## Next steps |
| 381 | + |
| 382 | +- See `FirebaseSwiftUI/README.md` for the full API reference and advanced usage. |
| 383 | +- See `samples/swiftui/FirebaseSwiftUISample` for a working example app. |
| 384 | +- For provider-specific setup details, refer to the Firebase Authentication docs for the provider you are enabling. |
0 commit comments