Ionic/Angular iOS端onAuthStateChanged无初始null值及登录挂起问题
Ionic/Angular迁移Angular/Fire模块化库后iOS端Auth无响应问题解决
我正在将一款Ionic/Angular应用从Firebase与Angular/Fire命名空间兼容库组合,迁移至Angular/Fire模块化库。更新后的代码在本地浏览器(通过ionic serve)及Android设备/模拟器上运行正常,但在iOS设备或模拟器上出现以下问题:
- 应用启动时调用
onAuthStateChanged无任何返回,首次调用甚至不返回null值; - 相关的
signInWithCustomToken调用会挂起——正常情况下登录成功后会触发onAuthStateChanged,但此处因问题1导致无响应,调用处一直处于等待状态。
应用启动时onAuthStateChanged的调用代码如下:
import { getAuth, onAuthStateChanged, signInWithCustomToken, UserCredential } from '@angular/fire/auth'; export class LoginService { loginInit() { const auth = getAuth(); this.unsubscribeFn = onAuthStateChanged(auth, async (user) => { if(!user) { this.loginUser(); } else { // Initialize user account } } async loginUser() { // Get custom token from backend after validation this.loginToken = this.getCustomToken(); const auth = getAuth(); const creds: UserCredential = await signInWithCustomToken(auth, this.loginToken); } }
我使用@angular/fire处理所有Firebase调用,包括此处的onAuthStateChanged和signInWithCustomToken。尝试过不同版本的firebase(11.0.2、9.22.1、8.10.1)及@angular/fire(7.6.1、16.0.0),但问题仍未解决。
app.module中的初始化代码如下:
provideFirebaseApp(() => initializeApp(environment.firebase)), provideAuth(() => getAuth()), provideDatabase(() => getDatabase())],
我的ionic info输出如下:
Ionic: Ionic CLI : 7.2.0 (/Users/username/.nvm/versions/node/v22.11.0/lib/node_modules/@ionic/cli) Ionic Framework : @ionic/angular 6.7.5 @angular-devkit/build-angular : 16.2.16 @angular-devkit/schematics : 16.2.16 @angular/cli : 16.2.16 @ionic/angular-toolkit : 12.1.1 Capacitor: Capacitor CLI : 6.2.0 @capacitor/android : 6.2.0 @capacitor/core : 6.2.0 @capacitor/ios : 6.2.0 Cordova: Cordova CLI : not installed Cordova Platforms : not available Cordova Plugins : not available Utility: cordova-res : not installed globally native-run : 2.0.1 System: ios-sim : 8.0.2 NodeJS : v22.11.0 (/Users/username/.nvm/versions/node/v22.11.0/bin/node) npm : 10.9.0 OS : macOS Unknown Xcode : Xcode 16.0 Build version 16A242d
由于代码在Android和Web端正常,推测是iOS缺少相关配置/设置。重新安装了Ionic的iOS平台,但问题依旧。尝试了多种组合,但无报错信息,无法定位问题。
解决方案
修改app.module中的provideAuth配置即可解决问题:
原代码:
provideAuth(() => getAuth())
修改为:
provideAuth(() => { if (Capacitor.isNativePlatform()) { return initializeAuth(getApp(), { persistence: indexedDBLocalPersistence }) } else { return getAuth() } })
内容的提问来源于stack exchange,提问作者Sanjay Tibrewal
相关产品推荐
相关产品推荐

