Firebase Google认证提示访问被阻止：应用请求无效问题排查

代码问题排查 #

你的代码末尾多了一个冗余的});，这会导致语法错误，直接影响认证流程执行。修正后的代码如下：

signInWithPopup(auth, provider)
  .then((result) => {
    // 获取Google访问令牌，可用于调用Google API
    const credential = GoogleAuthProvider.credentialFromResult(result);
    const token = credential.accessToken;
    // 获取已登录用户信息
    const user = result.user;

    alert(user.displayName);
    // ...其他业务逻辑
  }).catch((error) => {
    // 错误处理
    const errorCode = error.code;
    const errorMessage = error.message;
    const email = error.email;
    const credential = GoogleAuthProvider.credentialFromError(error);
    // ...其他错误处理逻辑

    alert(errorMessage);
  });

权限配置类问题解决步骤 #

即使修复代码后仍出现Access blocked: This app’s request is invalid，请按以下步骤排查配置：

• 确认Firebase授权域名
  1. 进入Firebase控制台 → 目标项目 → Authentication → 设置 → 授权域
  2. 检查colesprojects.ml（若使用www子域则需同时添加www.colesprojects.ml）已在列表中，注意域名不要带https://或路径后缀
• 同步Google OAuth客户端配置
  Firebase会自动生成OAuth客户端ID，但可能存在配置不同步情况：
  1. 进入Google Cloud控制台 → 目标项目 → API和服务 → 凭据
  2. 找到对应Firebase的Web客户端ID，检查已获授权的JavaScript来源是否包含https://colesprojects.ml
  3. 确认已获授权的重定向URI包含Firebase默认回调地址（格式为https://<你的项目ID>.firebaseapp.com/__/auth/handler）
• 清除浏览器缓存
  旧的OAuth会话缓存可能导致验证失败，尝试用无痕模式测试，或清除对应域名的Cookie和缓存后重试
• 验证Firebase SDK初始化
  确保auth和provider实例正确初始化，示例代码如下：

  import { initializeApp } from "firebase/app";
  import { getAuth, GoogleAuthProvider, signInWithPopup } from "firebase/auth";
  
  const firebaseConfig = {
    // 你的Firebase项目配置参数
  };
  
  const app = initializeApp(firebaseConfig);
  const auth = getAuth(app);
  const provider = new GoogleAuthProvider();
  

额外排查点 #

如果以上步骤均无效，重新下载Firebase项目配置文件（控制台→项目设置→添加应用→下载配置），替换项目中的旧配置文件，确保所有参数完全匹配。

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