部署在GAE标准环境中Firebase无法获取已登录用户的问题排查

看起来你遇到的这个问题，核心大概率和Firebase Auth的初始化时机、GAE的SPA路由配置细节或者Firebase的会话Cookie传递有关。结合你给出的信息，我整理了几个排查和解决方向：

1. 确保Firebase在应用入口提前初始化，等待Auth就绪后再渲染组件 #

你的认证检查是在App组件的componentDidMount中执行的，但如果Firebase SDK是在组件内部才初始化的，部署到GAE后可能因为资源加载速度的差异，导致组件挂载时Firebase还没完成Auth模块的初始化，这时候onAuthStateChanged的首次回调会拿到null，触发登出重定向。

解决方法：

• 在应用的入口文件（比如index.js）中提前初始化Firebase，并且等待Auth状态就绪后再渲染App组件：

// index.js
import React from 'react';
import ReactDOM from 'react-dom';
import firebase from 'firebase/app';
import 'firebase/auth';
import App from './App';

// 你的Firebase配置
const firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_AUTH_DOMAIN",
  // ...其他配置
};

firebase.initializeApp(firebaseConfig);

// 等待Auth初始化完成后再渲染App
firebase.auth().onAuthStateChanged(() => {
  ReactDOM.render(<App />, document.getElementById('root'));
});

2. 清理重复的Auth监听，避免内存泄漏和逻辑冲突 #

你现在的代码每次App组件挂载都会添加一个新的onAuthStateChanged监听，多次挂载后会存在多个监听实例，可能导致逻辑混乱（比如多次触发登出/登录）。建议在组件卸载时移除监听：

componentDidMount() {
  // 保存监听的卸载函数
  this.unsubscribeAuth = firebase.auth.onAuthStateChanged(authUser => {
    // ...你的现有逻辑
  });
}

componentWillUnmount() {
  // 移除监听
  this.unsubscribeAuth();
}

3. 检查Firebase控制台的授权域名配置 #

虽然根路径能正常认证，但还是要确认Firebase控制台中是否添加了部署的完整域名：

• 打开Firebase控制台 → 你的项目 → Authentication → Sign-in method → Authorized domains
• 确保https://xxx.appspot.com已经被添加到列表中（即使根路径可用，非根路径的请求可能触发更严格的域名校验）

4. 验证浏览器Cookie的传递情况 #

在非根路径访问时，打开浏览器开发者工具的Application标签，查看https://xxx.appspot.com下的Cookie：

• 确认是否存在Firebase相关的Cookie（比如前缀为firebase或__session的Cookie）
• 检查Cookie的Path属性是否为/（确保所有子路径都能访问），Secure属性是否为true（因为你的应用强制HTTPS）

如果Cookie不存在或属性不正确，可能是Firebase Auth的会话存储逻辑出现问题，可以尝试在Firebase初始化时显式配置会话持久化：

firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL)
  .then(() => {
    // 初始化完成后的逻辑
  })
  .catch((error) => {
    console.error("设置持久化失败:", error);
  });

5. 确认GAE的路由配置没有拦截Auth相关请求 #

你的app.yaml配置看起来是标准的SPA配置，但可以再检查两点：

• 确保/api/.*的handler不会拦截Firebase Auth的请求（Firebase的请求域名是www.googleapis.com，不会走你的GAE API路由，所以这点应该没问题）
• 静态资源的缓存设置是否合理，避免Firebase SDK的js文件被缓存过久，导致版本不一致：可以给静态资源handler添加缓存控制头，比如：

handlers:
- url: /(.*\.(json|ico|js))$
  secure: always
  static_files: store-build/\1
  upload: store-build/.*\.(json|ico|js)$
  headers:
    Cache-Control: "public, max-age=3600" # 根据实际需求调整缓存时间

按照以上步骤排查后，应该能解决非根路径的认证失败问题。如果还是不行，可以在浏览器开发者工具的Network标签中查看getAccountInfo请求的响应内容，看看具体的错误信息，这会帮助进一步定位问题。

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