Firebase Google弹窗登录遇auth/argument-error参数错误求助

我编写了以下代码实现Google弹窗登录功能：

const [user] = useAuthState(auth);
const provider = new GoogleAuthProvider();

const signInWithGoogle = async () => {
  try {
    const result = await signInWithPopup(auth, provider);
    console.log(result.user);
  } catch (error: any) {
    if (error.code === "auth/argument-error") {
      console.error(
        "Firebase Authentication: auth/argument-error - Incorrect argument provided."
      );
      // Handle the error, e.g., show an error message to the user
    } else {
      console.error("Firebase Authentication:", error);
      // Handle other errors
    }
  }
}

设置按钮点击调用signInWithGoogle函数后，控制台出现错误：

Firebase Authentication: auth/argument-error - Incorrect argument provided

点击按钮未弹出Google登录窗口，尝试多种网上方案无效，寻求帮助。

可能的解决方案 #

1. 验证auth实例初始化正确性 #

signInWithPopup的第一个参数必须是有效的Firebase Auth实例，确认你的auth是通过getAuth()正确初始化的：

import { getAuth } from "firebase/auth";
// 初始化Auth实例
const auth = getAuth();

若auth为undefined或未完成初始化，会直接触发参数错误。

2. 检查GoogleAuthProvider的导入与实例化 #

确保从Firebase Auth正确导入GoogleAuthProvider，且实例化时无错误参数：

import { GoogleAuthProvider } from "firebase/auth";
// 实例化不需要额外参数
const provider = new GoogleAuthProvider();

3. 统一Firebase SDK版本 #

若SDK各模块版本不一致（如auth模块与核心模块版本不匹配），可能导致参数处理异常，执行命令统一更新：

npm install firebase@latest

4. 确认按钮点击事件绑定 #

检查按钮点击事件是否正确绑定到函数，避免误写为立即执行：

// 正确绑定
<button onClick={signInWithGoogle}>Google登录</button>
// 错误示例（会提前执行函数）
<button onClick={signInWithGoogle()}>Google登录</button>

5. 核对Firebase控制台配置 #

确认控制台已启用Google登录方式，且添加了正确的授权域名（如本地开发的http://localhost:3000），配置错误可能间接引发参数类报错。

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