谷歌登录弹出窗口不会持续很长时间或显示“请求的操作无效”

Question

我有一个 Firebase Web 应用程序，谷歌登录弹出窗口不起作用，它不会持续或给我一条消息（检查图片）是否有解决办法

//sign in with google
const googleProvider = new GoogleAuthProvider();
const signInWithGoogle = document.querySelector('#google-icon');
signInWithGoogle.addEventListener('click', (e) => {
e.preventDefault();
signInWithPopup(auth, googleProvider).then((result) => {
 const user = result.user;
 const credential = GoogleAuthProvider.credentialFromResult(result);
 const accessToken = credential.accessToken;})
 .catch((error) => {
   const errorCode = error.code;
   const errorMessage = error.message;
   const email = error.email;
   const credential = GoogleAuthProvider.credentialFromError(error);
 });
});

Answer 1

我在使用 firebase auth 时遇到了同样的问题。 我的问题是 http://127.0.0.1:3000/ 未获得授权。

切换到 http://localhost:3000/ 后一切正常。

Answer 2

我有同样的错误，但我发现只需在signInWithPopup()函数中添加“browserPopupRedirectResolver”作为第三个参数即可解决它

您的代码应该是：

import { browserPopupRedirectResolver } from "firebase/auth";

//sign in with google
const googleProvider = new GoogleAuthProvider();
const signInWithGoogle = document.querySelector('#google-icon');
signInWithGoogle.addEventListener('click', (e) => {
e.preventDefault();
signInWithPopup(auth, googleProvider, browserPopupRedirectResolver).then((result) => {
 const user = result.user;
 const credential = GoogleAuthProvider.credentialFromResult(result);
 const accessToken = credential.accessToken;})
 .catch((error) => {
   const errorCode = error.code;
   const errorMessage = error.message;
   const email = error.email;
   const credential = GoogleAuthProvider.credentialFromError(error);
 });
});

这对我有用，希望你也这么做

Answer 3

使用新版本的 Firebase，您必须将所有域添加到 Firebase Installations API。 前往谷歌云控制台。

1. API与服务部分；
2. Firebase 安装 API。
3. 凭证
4. 浏览器密钥（由 firebase 提供）
5. 添加您想要访问您的应用程序的所有域。

谢谢！