离线状态下如何初始化Firebase PWA应用？Angular12+AngularFire环境启动报错问询

该auth/internal-error报错触发的根本原因是AngularFire Auth模块默认初始化逻辑存在两个离线兼容问题：

1. 离线状态下Auth会尝试动态加载远端SDK脚本、请求远端验证用户会话状态，脚本加载和请求都失败后抛出未捕获的Promise异常
2. 异常没有被默认的错误处理逻辑过滤，直接中断Angular应用的渲染流程，导致白屏

1. 配置Auth本地持久化策略 #

在应用初始化阶段、所有Auth业务逻辑执行前，强制指定Auth的持久化方式为浏览器本地存储，避免每次启动强制请求远端验证会话：

import { inject, APP_INITIALIZER } from '@angular/core';
import { getAuth, setPersistence, browserLocalPersistence } from 'firebase/auth';

export function initializeFirebaseAuth() {
  return async () => {
    const auth = getAuth();
    await setPersistence(auth, browserLocalPersistence);
  };
}

// 在app.module.ts的providers中注册初始化函数
@NgModule({
  providers: [
    {
      provide: APP_INITIALIZER,
      useFactory: initializeFirebaseAuth,
      multi: true
    }
  ]
})
export class AppModule {}

2. 全局过滤离线Auth错误 #

自定义Angular全局错误处理器，过滤离线状态下的Auth内部错误，避免异常中断应用渲染：

import { Injectable, ErrorHandler } from '@angular/core';

@Injectable()
export class CustomErrorHandler extends ErrorHandler {
  override handleError(error: unknown): void {
    if (
      !navigator.onLine &&
      error instanceof Error &&
      (error as any)?.code === 'auth/internal-error'
    ) {
      // 离线状态下的Auth初始化错误仅做日志打印，不抛出
      console.warn('Offline auth initialization skipped', error);
      return;
    }
    super.handleError(error);
  }
}

// 在app.module.ts的providers中替换默认错误处理器
providers: [
  { provide: ErrorHandler, useClass: CustomErrorHandler }
]

3. 调整PWA缓存规则 #

在ngsw-config.json中将Firebase Auth相关的静态资源加入预缓存列表，避免离线状态下动态加载脚本失败：

{
  "assetGroups": [
    {
      "name": "firebase-core",
      "installMode": "prefetch",
      "resources": {
        "urls": [
          "https://www.gstatic.com/firebasejs/*/firebase-auth*.js"
        ]
      }
    }
  ]
}

如果你的Firebase SDK是本地打包引入而非CDN加载，确认所有Auth相关的依赖文件都被纳入PWA缓存的资源范围。

4. 路由守卫兜底 #

在根路由添加离线状态判断守卫，离线启动时如果没有本地缓存的有效用户会话，直接跳转到无需身份验证的离线可用页面，避免强制走Auth初始化逻辑导致白屏。

5. 版本适配检查 #

如果你当前使用的AngularFire版本低于7.2.0，升级到适配Angular 12的最新稳定版，低版本AngularFire存在Auth离线初始化未捕获错误的已知Bug。

内容的提问来源于stack exchange，提问作者wonglik