Firebase authWithOAuthRedirect() 问题

Posted 2023-02-23

【中文标题】Firebase authWithOAuthRedirect() 问题

【英文标题】：Firebase authWithOAuthRedirect() woes

【发布时间】：2014-12-10 23:19:06

【问题描述】：

我正在尝试更新我的 angularjs 应用以支持 Firebase 1.1（我坚持使用 Firebase 1.0.x）。 它弃用了 firebasesimplelogin，包括 Firebase 核心内的身份验证。

我已经能够使用

成功实现身份验证

authWithOAuthPopup("<provider>", function(error, authData)  ... );

它接受一个回调，在authData中传递认证数据。

相反，我无法理解如何使用

authWithOAuthRedirect("<provider>", function(error)  ... );

Firebase Authentication docs page 非常简洁... :-(。就是这么说的：

或者 [而不是 authWithOAuthPopup]，您可以提示用户使用完整的浏览器重定向登录，当您返回原始页面时，Firebase 会自动恢复会话

当 Firebase - 重定向后 - 返回到我的页面时，我如何获取 authData？

【问题讨论】：

ref.onAuth(function(authData) ... 适合你吗？ firebase.com/docs/web/guide/…

是的！谢谢，这是正确的解决方案（如果您想将其发布为答案...）。不幸的是，我还有一些额外的问题（与我缺乏对角度逻辑的理解有关......）。如果您愿意，我会详细说明它作为我的问题的更新......但是，它与 auth 和/或 Firebase 完全无关......

如果不相关，我会发布一个新问题。

是的，我确实发布了一个新问题（此处：***.com/questions/26406593/…）。

【参考方案1】：

可以通过直接在 ref 上注册一个监听器来获得 authData（所以在调用 authWithOAuthRedirect 之前）。

ref.onAuth(function(authData)  
    ... 
 
ref.authWithOAuthRedirect("google", function(error)  ... );

见https://www.firebase.com/docs/web/guide/user-auth.html#section-monitoring-authentication

【讨论】：

我正在使用 AngularFire 来有效地做同样的事情（$ref.$onAuth，$ref.$authWithOauthRedirect). *after* the redirect completes, the $onAuth` 回调未被调用，我必须刷新页面才能登录。另一个答案提供了手动重新加载页面的解决方案，但我想避免这样做。还有其他想法吗？

^ 对我来说同样的问题！你找到解决办法了吗？

【参考方案2】：

我想我遇到了和你一样的问题。我正在尝试进行 Facebook 身份验证。

首先，我想澄清一下我的问题的重现步骤。

我的应用已加载到客户端。 用户点击 Facebook 登录。 ref.authWithOAuthRedirect('facebook', ...) 被调用。 客户端重定向到 Facebook，Facebook 将客户端重定向回 Firebase 应用 尽管通过 Facebook 成功进行了身份验证，但传递给 onAuth() 的回调被调用（仅一次）且 authData === null。

传递给 onAuth() 的回调不会使用正确的 authData 再次调用。

但是，重新加载应用程序会导致使用正确的 authData 调用传递给 onAuth 的回调。我不知道造成这种情况的原因，但我怀疑比赛条件。

这是我的解决方法。

在调用 ref.authWithOAuthRedirect('facebook', ...) 之前，请在 sessionStorage 中为自己设置一个标志。

sessionStorage.reload = true;
ref.authWithOAuthRedirect('facebook', ...)

当客户端从 Facebook 重定向回您的应用时，您应该能够检查此标志并在必要时重新加载页面。

if (sessionStorage.reload) 
    delete sessionStorage.reload;
    setTimeout(function() 
        location.reload();
    , 1000)

setTimeout(function() ... , 1000) 有助于对抗假定的竞争条件。我发现 500 毫秒不足以解决竞争条件。

还有一个小问题：如果您过早地重新加载页面，那么无论您重新加载页面多少次，authData 都将保持为空。

【讨论】：

谢谢，这解决了我使用 Google 身份验证的重定向问题。我怀疑 getAuth() 在重定向响应中不是同步/阻塞的。

我也在研究这个问题。 @Nikita 你有没有找到原因或比重新加载更好的解决方案？在进行 $authWithOAuthRedirect 调用之前，我也在使用 ref.$onAuth，但我得到了相同的结果。在我的情况下，我只是在第一次尝试没有设置 authData 之后调用 $authWithOAuthRedirect 作为第二次尝试。