本地使用localhost模拟器开发时如何处理Firebase App Check？

本地使用localhost对接Firebase模拟器开发时，不需要完全禁用App Check，完全可以模拟其运行能力，常见两种实现方案如下：

方案1：适配官方调试提供器实现本地校验 #

你遇到的本地reCAPTCHA认证返回403问题，本质是未把localhost加入reCAPTCHA站点密钥的允许域名列表，调试提供器本身也可对接本地模拟器场景，配置步骤如下：

• 进入Google reCAPTCHA管理后台，将localhost添加到当前使用的reCAPTCHA v3站点密钥的允许域名列表，即可解决PERMISSION_DENIED报错。
• 客户端代码通过环境变量判断开发环境，自动启用调试模式：

const appCheck = firebase.appCheck();
// 仅本地开发启用调试token
if (process.env.NODE_ENV === 'development') {
  self.FIREBASE_APPCHECK_DEBUG_TOKEN = process.env.REACT_APP_FIREBASE_APP_CHECK_DEBUG_TOKEN;
}
appCheck.activate(
  process.env.REACT_APP_FIREBASE_APP_CHECK_SITE_KEY,
  // 本地开发关闭生产环境的自动令牌刷新校验
  process.env.NODE_ENV !== 'development'
);

• 本地云函数模拟器默认不会自动填充context.app属性，可在云函数入口增加环境判断，模拟器环境下手动读取请求头的X-Firebase-AppCheck字段，和预设的调试token比对，匹配成功后手动给context.app赋值，模拟校验通过状态。

方案2：完全离线模拟App Check能力 #

不需要调用任何云端App Check服务，全链路本地模拟：

• 客户端本地开发时不激活真实App Check实例，封装模拟工具类，每次发起云函数请求时自动在请求头携带固定的本地测试token。
• 云函数代码增加环境判断，检测到运行在模拟器环境时，直接校验请求头的测试token，校验通过后手动构造context.app对象，填入和生产环境结构一致的校验参数（如appId、验签通过标识等），完全对齐生产环境的返回逻辑。

注意事项 #

所有调试/模拟逻辑必须通过环境变量做开关，禁止提交到生产分支上线，避免造成安全漏洞。

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