基于Javascript的网站Firebase谷歌与Facebook登录失败问题求助

• 基于JavaScript开发的网站集成了Firebase Google和Facebook登录功能，此前运行正常，3个月后功能失效
• 已确认firebaseConfig、project_id等配置项无误，清理浏览器缓存、更换浏览器测试后问题仍存在
• 初始阶段出现/__/firebase/init.json文件404错误，后续浏览器可正常显示Google登录页面，但完成登录操作后，onAuthStateChanged(auth, async (user) => {}回调中显示用户未登录
• 核心代码如下：

import { getAuth, FacebookAuthProvider, GoogleAuthProvider, signInWithRedirect, 
  getRedirectResult, onAuthStateChanged, signOut } from "https://www.gstatic.com/firebasejs/10.14.1//firebase-auth.js";

//Google SignIn button click
googleSignIn.addEventListener('click', async()=>{

  console.log('Google button clicked');
  await signInWithRedirect(auth, googleProvider);

  getRedirectResult(auth)
  .then((result) => {
    // This gives you a Google Access Token. You can use it to access Google APIs.
    const credential = GoogleAuthProvider.credentialFromResult(result);
    const token = credential.accessToken;
    
    console.log("token is");
    // The signed-in user info.
    const user = result.user;

    createFireStoreUser(user.uid, user.displayName);

    // IdP data available using getAdditionalUserInfo(result)
    // ...
  }).catch((error) => {
    // Handle Errors here.
    console.log("error is");
    const errorCode = error.code;
    const errorMessage = error.message;
    // The email of the user's account used.
    const email = error.customData.email;
    // The AuthCredential type that was used.
    const credential = GoogleAuthProvider.credentialFromError(error);
    // ...
  });

});

1. 修正Firebase SDK导入路径错误
   导入URL中存在多余斜杠：https://www.gstatic.com/firebasejs/10.14.1//firebase-auth.js，需将10.14.1//改为10.14.1/，多余斜杠可能导致资源加载异常，影响Auth状态同步。

2. 调整登录逻辑的执行时机
   使用signInWithRedirect后页面会跳转，当前页面的后续代码（包括getRedirectResult）不会执行。正确逻辑应为：

   • 按钮点击事件中仅调用signInWithRedirect
   • 页面初始化时调用getRedirectResult处理跳转后的登录结果
     调整后示例代码：

   // 页面初始化时处理跳转后的登录结果
   getRedirectResult(auth)
     .then((result) => {
       if (result) {
         const credential = GoogleAuthProvider.credentialFromResult(result);
         const token = credential.accessToken;
         const user = result.user;
         createFireStoreUser(user.uid, user.displayName);
       }
     }).catch((error) => {
       console.error("登录结果处理失败:", error);
     });
   
   // Google登录按钮点击事件
   googleSignIn.addEventListener('click', async()=>{
     console.log('Google button clicked');
     await signInWithRedirect(auth, googleProvider);
   });
   

3. 检查Firebase身份验证提供商状态
   登录Firebase控制台，进入Authentication > 登录方法，确认Google和Facebook登录提供商是否处于启用状态，项目设置可能因长时间未使用或政策变更被调整。

4. 验证OAuth授权回调URL

   • Google登录：检查Authentication > 登录方法 > Google > 已授权的重定向URI，确保包含当前网站域名（如生产环境域名或本地开发的http://localhost:端口）
   • Facebook登录：在Facebook开发者平台的产品 > Facebook登录 > 设置 > 有效的OAuth重定向URI中，确认URI与Firebase配置一致

5. 排查onAuthStateChanged实现
   确保回调逻辑正确识别用户状态，避免被错误逻辑覆盖：

   onAuthStateChanged(auth, async (user) => {
     if (user) {
       console.log("用户已登录:", user);
       // 处理已登录状态
     } else {
       console.log("用户未登录");
       // 处理未登录状态
     }
   });
   

   确认回调未被异步操作阻塞，无逻辑错误导致无法识别用户。

6. 更新Firebase SDK版本
   尝试将SDK更新至最新稳定版，替换导入URL为对应版本（注意单斜杠），避免旧版本bug引发的问题。

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