iOS设备Firebase Auth验证时无法加载reCAPTCHA依赖求助

问题描述 #

在iOS设备上使用Firebase Auth完成手机号验证时，部分设备加载CAPTCHA验证页面突然中断，日志抛出错误：

[firebase_auth/web-internal-error] unable to load external reCAPTCHA dependencies!

仅部分iOS设备出现该问题，其余设备可正常运行。以下是环境信息及相关代码：

Flutter环境信息 #

flutter doctor -v
[✓] Flutter (Channel stable, 2.10.5, on macOS 13.0 22A380 darwin-arm, locale en-EG)
    • Flutter version 2.10.5 at /Users/Home/flutter/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5464c5bac7 (8 months ago), 2022-04-18 09:55:37 -0700
    • Engine revision 57d3bac3dd
    • Dart version 2.16.2
    • DevTools version 2.9.2

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /Users/Home/Library/Android/sdk
    • Platform android-33, build-tools 30.0.3
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2021.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)

[✓] IntelliJ IDEA Ultimate Edition (version 2021.2.2)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    • Flutter plugin version 60.1.4
    • Dart plugin version 212.5284.31

[✓] VS Code (version 1.74.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.54.0

[✓] Connected device (3 available)
    • sdk gphone64 arm64 (mobile) • emulator-5554                        • android-arm64  • Android 12 (API 31) (emulator)
    • iPhone 14 (mobile)          • E4D5DE76-9812-4DE2-9069-DA890CC69502 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-16-1 (simulator)
    • Chrome (web)                • chrome                               • web-javascript • Google Chrome 108.0.5359.98

[✓] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

iOS端AppDelegate代码 #

import UIKit
import Flutter
import FirebaseCore
import Firebase

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
      FirebaseApp.configure()
    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
    
     override func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
                let firebaseAuth = Auth.auth()
                firebaseAuth.setAPNSToken(deviceToken, type: AuthAPNSTokenType.unknown)
      }
      override func application(_ application: UIApplication, didReceiveRemoteNotification userInfo: [AnyHashable : Any], fetchCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void) {
                let firebaseAuth = Auth.auth()
                if (firebaseAuth.canHandleNotification(userInfo)){
                    print(userInfo)
                    return
                }
     }

}

可行解决方案 #

1. 升级Firebase Auth插件版本 #

当前使用的Flutter 2.10.5对应的firebase_auth插件可能存在iOS平台特定的reCAPTCHA加载兼容问题，建议升级到适配该Flutter版本的最新稳定版插件，新版本通常会修复这类场景的bug。

2. 配置iOS ATS规则 #

部分设备可能因ATS（App Transport Security）限制无法加载reCAPTCHA外部资源，在Info.plist中添加以下配置，允许访问reCAPTCHA相关域名：

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <false/>
    <key>NSExceptionDomains</key>
    <dict>
        <key>google.com</key>
        <dict>
            <key>NSIncludesSubdomains</key>
            <true/>
            <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
            <false/>
        </dict>
        <key>recaptcha.net</key>
        <dict>
            <key>NSIncludesSubdomains</key>
            <true/>
            <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
            <false/>
        </dict>
    </dict>
</dict>

3. 检查Firebase配置文件有效性 #

确认GoogleService-Info.plist文件完整，其中RECAPTCHA_SITE_KEY等相关字段存在且配置正确，无缺失或错误。

4. 切换至reCAPTCHA v3（可选） #

若reCAPTCHA v2仍存在加载问题，可尝试使用无交互的reCAPTCHA v3模式，在Firebase控制台启用v3验证后，修改代码对应配置即可，避免网页加载环节的兼容性问题。

5. 清理缓存并重新构建 #

执行以下步骤清理缓存后重新构建项目：

• 清理Flutter缓存：flutter clean
• 重新拉取依赖：flutter pub get
• 重置iOS端Pods：

  cd ios
  pod deintegrate
  pod install
  

内容的提问来源于stack exchange，提问作者Mahmoud Gamal El-Din