作者:YANLIUPING | 来源:互联网 | 2023-06-30 17:58
前提
$npm install –save firebase@4.11.0
问题
我在我的Web应用程序上使用firebase身份验证.
在我的应用程序中,我为客户端js实现了onAuthStateChanged,如下所示.
firebase.auth().onAuthStateChanged((user) => {
if(user) {
//logged in
} else {
//do sth
}
});
登录后,我确认此方法将返回实际用户obj,但如果我刷新页面,则用户可能为null.
奇怪的是,有时用户不会为空.
我担心调用onAuthStateChanged有一些限制,但目前我不知道.
我该如何处理这个问题?
更新
让我分享一下我的最小例子.
我的应用正在使用express.js.
有两个网址,如下所示.
/登录
/主要
在登录页面中,我实现了身份验证方法.
如果登录成功完成,则用户将被重定向到“/ main”.
//login.js
import firebase from 'firebase';
var cOnfig= {...};
firebase.initializeApp(config);
var provider = new firebase.auth.GoogleAuthProvider();
firebase.auth().signInWithPopup(provider)
.then((result) => {
return result.user.getIdToken(true);
}).then((idToken) => {
if(idToken) {
location.href = '/main';
}
});
在主页面中,没有登录方法.
main.js仅检查用户是否已登录.
//main.js
import firebase from 'firebase';
var cOnfig= {...};
firebase.initializeApp(config);
firebase.auth().onAuthStateChanged((user) => {
if (user) {
//initialize main page.
} else {
location.href = '/login';
}
}
我认为登录状态存储在Web浏览器的LocalStorage上.
这意味着,在完成main.js的加载后,onAuthStateChanged将自动触发用户信息,但不能按预期工作.
我确信登录信息的持久性是正确的,因为官方文档说默认设置是针对Web客户端的LOCAL.
https://firebase.google.com/docs/auth/web/auth-state-persistence
我的问题
我应该用另一种方式实现onAuthStateChanged吗?
如何确保用户在重新加载后登录?
例如
import $from 'jquery';
$(document).on('ready', () => {
onAuthStateChanged((user) => {...});
});
或者你能告诉我正确的方法吗?
解决方法
如果返回null,我决定删除会话并将重定向设置为登录页面.这不是解决方案,而是目前的解决方法……
解决方法:
你没有调用onAuthStateChanged.相反,你告诉Firebase在身份验证状态发生变化时给你打电话,这可能会在重新加载页面时发生几次
当页面被加载并且之前有用户登录时,身份验证状态可能会改变几次,而客户端正在确定用户的身份验证状态是否仍然有效.因此,在看到与实际登录用户的最终通话之前,您可能会看到没有用户的通话.