javascript - Firebase Google signInWithRedirect 在身份验证成功后不会重定向到指定页面

Question

以下问题需要一点帮助/解释。我在我的项目中使用 Vue 和 Firebase。

我尝试通过调用 signInWithRedirect 设置 Firebase Google 登录。身份验证本身可以工作，但并不完全是我想要的。

我需要它在身份验证后重定向到/dashboard，但目前它在短暂加载后重定向回/login 页面。

我知道我必须使用getRedirectResult，但我不确定如何准确地调用它。如果有人能解释我如何正确编写代码以获得想要的结果，我将非常感激。

.signInWithRedirect(fb.googleProvider)
.then(credential => {
this.$store.commit("setCurrentUser", credential.user)
fb.usersCollection.doc(credential.user.uid).set({
}).then(() => {
this.$store.dispatch("fetchUserProfile")
this.updateGmailData()
this.$router.push("/dashboard")
}).catch(err => {
console.log(err)
})
}).catch(err => {
console.log(err);
});
},

我相信我的初始身份验证应该如下所示 -

googleLogin() {
fb.auth.signInWithPopup(fb.googleProvider)
}

之后我应该设置 getRedirectResult 函数，该函数应该将路由器推送到/dashboard？

如何进行重定向以等待 getRedirectResult 并在获得所需结果后重定向/dashboard。

我不知道如何实现它。

Answer 1

signInWithRedirect 将重定向回完成登录的同一页面。然后，您可以在用户登录后使用 getRedirectResult() 或 onAuthStateChanged 监听器重定向到您的仪表板。

在登录按钮点击处理程序中，调用:

// This will redirect to IdP for sign-in.
firebase.auth.signInWithRedirect(fb.googleProvider);

然后在同一页面上，您可以设置监听器:

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User signed in, you can get redirect result here if needed.
    // ...
    this.$router.push("/dashboard");
    // ....
  } else {
    // Show sign in screen with button above.
  }
});