React-native - Firebase onAuthStateChanged 无法正常工作

Posted

技术标签:

【中文标题】React-native - Firebase onAuthStateChanged 无法正常工作【英文标题】:React-native - Firebase onAuthStateChanged not working correctly 【发布时间】:2018-04-19 08:18:39 【问题描述】:

我无法在我的 react-native 应用程序中保留 firebase 会话。这个问题几乎与 React Native - Firebase auth persistence not working 但是那里提供的答案对我不起作用。

目前我的登录方式如下:

export const loginUser = ( email, password ) => 
  return (dispatch) => 
    dispatch( type: LOGIN_USER );

    firebase.auth().signInWithEmailAndPassword(email, password)
      .then(user => loginUserSuccess(dispatch, user))
      .catch(() => loginUserFailed(dispatch))

  ;
;

我的会话已创建,我可以访问存储在 firebase 上的用户对象。

当我 Cmd+R 或当我关闭应用程序并重新打开它时,我的会话就消失了。我在 app.js 文件的 componentWillMount() 部分运行了以下内容:

firebase.auth().onAuthStateChanged((user) => 
  if (user) 
    console.log('user is logged');
   else 
    console.log('not logged in')
  
);

每当我刷新应用程序或将其完全关闭并重新打开时,我都会收到“未登录”响应。

我也试过查询:

firebase.auth().currentUser

但在返回 null 时遇到同样的问题

我做错了什么?

有没有一种特殊的方法可以让我错过的会话保持活动状态?

【问题讨论】:

凭证临时密钥存储在浏览器中(会话或 cookie 或两者)。您可能已修改浏览器以在页面关闭时清除会话?不确定。我什至可以使用同一个浏览器打开一个新标签,并且已经登录。希望这会有所帮助。检查您的浏览器会话/cookie 设置是否恢复默认设置? @ronroyston 这是一个反应原生的移动应用程序。 I️ 正在为 androidios 设备创建本机应用程序。 I️ 不要认为应用程序会删除会话 cookie。我️可能是错的 您使用的是最新版本的 firebase.js 吗? 4.5.2 中修复了一个与 react-native 持久性相关的问题。 这看起来很像 Udemy react-native 课程作业,这与我遇到的问题相同。用户在重新加载应用程序后永远不会被重置,因此它总是显示注销按钮,而不是登录表单。我有一个要点gist.github.com/mjstelly/42124cc52bf08b1b257e1e535fa163ad 【参考方案1】:

我已经有一段时间没有发布这个问题了,但我想我会发布我的解决方案。

事实证明,我的初始设置(有点)奏效了。我的意思是 onAuthStateChanged 需要一些时间才能收到来自 firebase 的回复,在此期间,应用程序的其余部分加载时认为用户未登录,因为这是默认状态。

我设法通过将 onAuthStateChanged 逻辑移出 app.js 并移入 componentWillMount 的初始主页来解决此问题。现在看起来像这样:

componentWillMount() 
const  navigate  = this.props.navigation;
firebase.auth().onAuthStateChanged((user) => 
  if (user) 

    SplashScreen.hide()
    this.setState( loading: false )

    this.props.persistedUserLoginSuccess(user, navigate)

    this.props.fetchUserData();

   else 

    SplashScreen.hide()
    this.setState( loading: false )

  
);

此外,我设法通过强制启动屏幕保持在正在查询身份验证的状态来改善用户体验。完成后,启动屏幕被隐藏,应用程序加载为已登录的应用程序或用户尚未登录的应用程序。

【讨论】:

【参考方案2】:

这个问题是因为您在登录后没有执行 Firebase.auth().signOut()。尝试注销(为了测试,您可以随时在 componentWillMount 函数中注销),您将能够看到 onAuthStateChanged 通知。

【讨论】:

以上是关于React-native - Firebase onAuthStateChanged 无法正常工作的主要内容,如果未能解决你的问题,请参考以下文章

Firebase 和 react-native 集成

在 react-native 和 firebase 3.1 中登录 Facebook

React-Native:如何在 Airbnb 地图上渲染来自 firebase 的标记列表?

在 React-Native 中的非异步函数中调用异步函数 - Firebase

react-native ios项目中的Firebase身份验证问题

用 react-native-firebase 编译 react-native