使用 Firebase signInWithRedirect 是否可以将其配置为将我重定向回特定页面

Question

当我打电话

this.afAuth.auth.signInWithRedirect(provider) .then((credential) => { }) .catch((error) => this.handleError(error));

重定向工作正常，并由 firebase 处理，将我返回到登录页面。然而，承诺需要一段时间才能完成

this.afAuth.auth.getRedirectResult().then((result) => { //Login or move to request additional info });

由于页面已经完全刷新，我没有任何信息让我知道页面不应该显示登录按钮，而是应该显示加载状态。

有没有人找到解决这个问题并保持加载状态的好方法，我最初的尝试是使用角度路由来传递加载状态，但令人讨厌的是 signInWithRedirect 服务似乎没有更改它重定向到的 url。

Answer 1

FirebaseUI使用本地存储来维护是否显示加载状态（source）。你也应该能够做到这一点。但是，如果您不想处理本地存储并且不介意污染 URL，则始终可以在调用之前向 URL 添加唯一的查询/哈希参数signInWithRedirect（Firebase Auth 序列化当前 URL 并将其传递redirect_uri给 OAuth 端点（来源）。

使用哈希参数的示例

// you can use any string here; just make sure to use the same one after reload
window.location.hash = "redirecting"
this.afAuth.auth.signInWithRedirect(provider)
  .then((credential) => {
  })
  .catch((error) => this.handleError(error));

然后你可以在你的组件渲染后立即检查（重定向后）：

this.loading = (window.location.hash === "redirecting")
// Clear the hash
window.location.hash = ""

希望这可以帮助。

编辑

您还可以通过在重定向之前使用window.history.replaceState和window.history.pushState更改URL 来实现将重定向 URL 设置为您想要的任何内容（类似于上面的哈希示例）。