浏览器刷新Angular 2后，Firebase变量变为null

Question

我是angular 2的新用户，我已成功实施Firebase身份验证，该身份验证基于用户设置的电子邮件和密码。

用户登录后，Firebase变量已初始化，可在整个应用中访问，但一旦用户进入应用并刷新页面，Firebase变量就会变为空。

我的问题是如何在刷新后维护Firebase状态。尝试了本地存储方法，但这似乎不合适。 SO中的大多数相关查询都是针对AngularJS的。

有什么想法吗？

修改

Firebase在appcomponant.ts文件中初始化

  firebase.initializeApp({
  apiKey: 'A******E',
  authDomain: 'e******m',
  databaseURL: 'h*****m',
  projectId: 'e******r',
  storageBucket: 'e******m',
messagingSenderId: '****93***'
});

在我的登录服务中，我正在使用

  signInUser(email: string, password: string) {
return firebase.auth().signInWithEmailAndPassword(email, password);

}

用户通过身份验证后，会被定向到名为“设置”的页面。在设置组件中，我想获取经过身份验证的用户的电子邮件。当流程为userlogin - ＆gt;设置页面时，这一切顺利，firebase不为空。

当用户在设置页面中点击F5刷新页面时，问题就开始了，此时Firebase对象变为空。

Answer 1

用户LocalStorage存储您从firebase收到的令牌。要在本地存储中设置，您可以

localStorage.setItem('fireBaseToken', 'token');

然后在您的主app.component.ts中检查令牌是否存在，如果它确实将其添加到您的变量，否则重定向用户再次登录。

注意

默认情况下，Angular CLI应添加＆＃34; dom＆＃34;到你的 tsconfig.json ，否则你自己添加。