Firebase Web端邮箱登录链接：跨设备验证后跳转桌面端问题

核心问题在于你当前使用了固定的dashboardURL，导致无论在哪台设备完成验证，都会跳转到同一个地址。要实现跳回发起登录的桌面端，需要动态传递发起端地址并在验证后处理跳转逻辑，具体步骤如下：

1. 发起登录时动态生成带发起端地址的跳转URL #

在桌面端发起登录请求时，获取当前页面的域名/完整仪表盘地址，将其作为参数附加到actionCodeSettings的url中，确保验证链接能携带发起端的地址信息：

// 桌面端发起登录的代码
const userEmail = document.getElementById('email-input').value;
// 保存用户邮箱到本地存储，后续验证时需要用到
window.localStorage.setItem('emailForSignIn', userEmail);

// 获取当前桌面端的仪表盘完整地址
const originDashboardUrl = `${window.location.origin}/dashboard`;

const actionCodeSettings = {
  // 将发起端地址作为参数拼接到跳转URL中
  url: `${originDashboardUrl}?source=email-signin`,
  handleCodeInApp: true,
  // 若使用Firebase动态链接，需配置你的动态链接域名（可选，用于跨平台跳转优化）
  dynamicLinkDomain: 'your-dynamic-link-domain.page.link'
};

// 发送登录链接
firebase.auth().sendSignInLinkToEmail(userEmail, actionCodeSettings)
  .then(() => {
    alert('登录链接已发送至你的邮箱，请点击完成验证');
  })
  .catch(err => console.error('发送链接失败:', err));

2. 处理验证后的跳转逻辑 #

当用户在手机端点击邮件链接后，应用会启动并触发邮箱链接的验证流程。此时先完成认证，再提取发起端地址并跳转：

// 应用全局初始化/路由入口处的代码
if (firebase.auth().isSignInWithEmailLink(window.location.href)) {
  // 从本地存储获取之前保存的邮箱，若无则提示用户输入
  let email = window.localStorage.getItem('emailForSignIn');
  if (!email) {
    email = prompt('请输入你的邮箱以完成登录');
  }

  // 完成邮箱链接认证
  firebase.auth().signInWithEmailLink(email, window.location.href)
    .then(result => {
      // 认证成功，清除本地存储的邮箱
      window.localStorage.removeItem('emailForSignIn');

      // 提取发起端的仪表盘地址
      const urlParams = new URLSearchParams(window.location.search);
      // 解析出完整的发起端地址（如果是拼接的origin，这里可以调整参数名）
      const targetUrl = urlParams.get('redirect_url') || `${window.location.origin}/dashboard`;

      // 在新标签页打开发起端的仪表盘（适配跨设备场景）
      window.open(targetUrl, '_blank');
      // 可选：关闭手机端当前验证页面
      window.close();
    })
    .catch(err => console.error('登录验证失败:', err));
}

3. 必要的安全配置 #

• 登录Firebase控制台，进入Authentication > 设置 > 授权域名，添加桌面端和手机端的所有域名，避免跳转被拦截
• 若使用动态链接，确保已在Firebase控制台配置好动态链接域名，并验证域名所有权

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