Angular搭配Firebase配置App Check后出现权限不足错误

排查解决步骤 #

• 验证用户登录状态：你的安全规则要求request.auth.uid != null才能访问数据，触发Firestore操作前请先确认用户已完成Firebase Auth登录，未登录状态下request.auth为null会直接触发权限错误。可以在调用Firestore前打印AngularFireAuth的当前用户状态验证。
• 修正Firebase初始化混用问题：你的代码中同时使用了AngularFireModule.initializeApp(environment.firebase)和provideFirebaseApp(() => initializeApp(environment.firebase))两种初始化方式，会生成两个独立的Firebase App实例，App Check绑定的实例和Firestore使用的实例不匹配，导致App Check令牌无法随请求携带。请删除AngularFireModule.initializeApp(environment.firebase)这行，统一使用模块化的provide系列方法初始化。
• 验证App Check令牌生成状态：在浏览器控制台手动调用App Check的getToken()方法，确认是否能正常返回有效令牌，无报错。如果令牌生成失败，检查reCAPTCHA v3密钥是否和Firebase控制台配置的站点密钥完全一致，不要误用reCAPTCHA v2的密钥。
• 确认App Check强制校验配置：如果你在Firebase控制台开启了Firestore的App Check强制校验，令牌生成失败的请求会被直接拦截返回权限不足。你可以临时关闭强制校验测试，如果关闭后请求正常，即可定位是App Check配置问题。
• 验证环境分支逻辑：你的代码中通过environment.useEmulators判断是否初始化正式App Check，可在初始化逻辑前打印environment.useEmulators的值，确认生产环境下逻辑正常走到provideAppCheck分支，没有因为变量值错误导致App Check未初始化。
• 临时调整安全规则定位问题：可临时将Firestore安全规则改为allow read, write: if true;，如果修改后请求正常，说明问题出在权限规则侧，优先排查登录状态同步问题；如果修改后仍报错，说明问题出在App Check配置侧。
• 验证版本兼容性：你当前使用的AngularFire 7.2.0官方适配的Firebase版本为9.8.x系列，9.19.0版本过高可能存在兼容性问题，可将Firebase版本降级到9.8.0后重试。

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