点击验证链接后，Firebase 将用户重定向到页面

Question

我在 Ionic 的网络应用程序中使用 firebase，我想在用户单击验证电子邮件中的链接后将用户重定向到特定页面（在我的情况下为登录页面）。
目前，当用户点击验证链接时，他会被重定向到另一个浏览器页面，上面显示他已经确认了电子邮件。

我想将他直接重定向到我的网络应用程序的页面，而无需通过该确认。
有可能吗？

Answer 1

这是帮助我的代码。我只是为你提供你需要的必要代码你必须自己填写其余代码?。

Firebase v9 示例

import React from "react";
import {
  createUserWithEmailAndPassword,
  sendEmailVerification
} from "@firebase/auth";
import {useHistory} from "react-router-dom"

export default function SignUp() {
  const history = useHistory()
  async function submit(e) {
    e.preventDefault() // Prevent default.

    // Sign your user using createUserWithEmailAndPassword

    // Provide user's email and password
    await createUserWithEmailAndPassword(email, password);

    // Send verification email.
    await sendEmailVerification(userCredentials.user);

    let interval = setInterval(async() => {
      if (userCredentials.user.emailVerified) {
        clearInterval(interval);
        history.push("/desired-link");
      }
      await userCredentials.user.reload();
    }, 2000);
  }
  return < > { /* your sign up form */ } < />;
}

Firebase v8 代码：

import React from "react";
import firebase from "firebase"
import {useHistory} from "react-router-dom"

export default function SignUp() {
    const history = useHistory()
    async function submit(e) {
        e.preventDefault() // Prevent default.
        
        // Sign your user using createUserWithEmailAndPassword
        
        // Provide user's email and password
        let userCredentials = await firebase.auth.createUserWithEmailAndPassword(email, password);

        // Send verification email.
        await userCredentials.user.sendEmailVerification()

        let interval = setInterval(async () => {
            if (userCredentials.user.emailVerified) {
                clearInterval(interval);
                history.push("/desired-link");
            }
           await  userCredentials.user.reload();
        }, 2000);
    }
    return <>{/* your sign up form */}</>;
}

用户一点击验证链接，就会发现你的网页重定向到<domain.name>/desired-link。

但是，给你一个额外的提示...... 不要操纵操作 url。 这是因为这样做，firebase.auth.currentUser.emailVerified 将始终返回 false。意思是，用户电子邮件永远不会被验证。这是因为此操作 URL 负责电子邮件验证。所以，不要这样做，而是按照我的例子。这适用于 localhost 和您的自定义域。快乐编码?

Answer 2

是的，这是可能的。在左侧的 firebase.console 中查找“身份验证”。 然后找到“模板”并寻找“电子邮件地址验证”。我认为它是默认打开的。在模板上你会看到一个小铅笔，点击它。之后，您可以根据需要更改模板。在底部，您会找到“自定义操作 URL”链接。打开此链接，将您的 URL 粘贴到模式窗口中并保存。就是这样。

Answer 3

不幸的是，您不能让 Firebase 进行身份验证然后重定向。目前对此接受的答案是一半。通过进入“Firebase -> 身份验证 -> 模板 -> 电子邮件地址验证 -> 编辑（又名铅笔按钮）”。然后，您可以单击“自定义操作 URL”并在此处插入所需的任何 URL。

请注意您输入的此 URL 不会在执行电子邮件验证后将您重定向到该页面。它所做的只是不生成链接<firebase email verification link>?mode=verifyEmail&oobCode=<code>，而是将您定向到<link you put in>?mode=verifyEmail&oobCode=<code>。这意味着当用户登陆此页面时，您将必须自己处理电子邮件验证。这意味着解析查询参数，并将此信息发送到后端的 Firebase 以验证有问题的电子邮件。有关如何验证电子邮件地址的潜在信息，请参阅以下内容：https://firebase.google.com/docs/reference/rest/auth#section-confirm-email-verification

更多信息可以在这里找到：https://support.google.com/firebase/answer/7000714

Answer 4

我无法在这里找到任何解决方案。因此，在查找文档后，我发现您在电子邮件验证后添加了一个继续 URL，firebase 在确认后将重定向到该 URL。 https://firebase.google.com/docs/auth/web/passing-state-in-email-actions

验证电子邮件后，如果您在 firebase 规则中使用 email_verified，您可能还必须强制刷新 firebase 令牌。

你可以做我做的。

1. 通过ActionCodeSettings 发送电子邮件验证。

  auth.createUserWithEmailAndPassword(email, password)
  .then((res) => {
    res.user.sendEmailVerification({
      url: "https://example.com/path?confirm_email=true",
    });
    return createUser({ email, uid: res.user.uid, name });
  })

这将使 firebase 在电子邮件验证后重定向到 https://example.com/path?confirm_email=true。 confirm_email 是为了让我知道何时强制刷新 firebase 令牌。

（可选）

1. 一旦重定向到您想要的页面，您可以检查 confirm_email 参数并相应地强制刷新令牌。

const urlParams = new URLSearchParams(window.location.search);
const isConfirmingEmail = urlParams.get('confirm_email');


auth.currentUser.getIdToken(!!isConfirmingEmail).then(() => {
  // Refreshed Token
})