离子 2 角火2 身份验证

Question

我在订阅 angularfire auth 时遇到了问题。 基本上，当我像这样订阅时，发生了什么：this.af.auth.first().subscribe(auth => { console.log(auth) })身份验证被打印到控制台两次，而不仅仅是一次。我想我找到了这个问题的原因，但我不明白为什么会发生或该怎么做。在我的app.component.ts中，我也像这样订阅身份验证：

this.af.auth.first().subscribe(auth => {
  console.log("app")
  if (auth) {
    console.log('logged in');
    this.rootPage = "page1"
  } else {
    console.log('not logged in');
    this.rootPage = "login"
  }
})

如果我删除此订阅，那么我只有一次打印到上述订阅的控制台。我希望能够在这两个位置订阅，因此当加载应用程序时，我可以根据需要重定向到登录，并且还可以从其他订阅中获取应用程序中的用户 uid。如果您有任何很棒的想法，谢谢！

Answer 1

您必须在constructor中调用它，如下所示。之后也unsubscribe。

app.component.ts

constructor(platform: Platform, af: AngularFire) {
    const authListener = af.auth.subscribe(auth => {
       if (auth) {
        console.log('logged in');
        this.rootPage = "page1";
        authListener.unsubscribe();//unsubscribe here
      } else {
        console.log('not logged in');
        this.rootPage = "login";
        authListener.unsubscribe();//unsubscribe here
      }
    });
    platform.ready().then(() => {
    });
  }

Answer 2

所以我试过了，但它对我不起作用。这是我在app.component.ts中所做的

constructor(public af: AngularFire) {
    const authListener = af.auth.subscribe(user => {
      if (user) {
        console.log('logged in');
        this.rootPage = "page-conversations"
        authListener.unsubscribe();//unsubscribe here
      } else {
        console.log('not logged in');
        this.rootPage = "page-login"
        authListener.unsubscribe();//unsubscribe here
      }
    });
    this.initializeApp();
  }

然后这是我在页面中所做的

ionViewDidLoad() {
    this.af.auth.subscribe(auth => {
         console.log("auth hello")
    })
  }

仍然有两个控制台日志。

更新所以我发现了问题所在。我相信这是因为深度链接。当我加载页面时，我被确定为已登录，因此我被重定向到另一个页面。这会将 url 更改为： http://localhost:8100/#/page-conversations然后当我刷新页面时，url 是相同的，因此该页面已加载，但我的 app.component.ts 还确定我已登录，因此我被重定向到我已经在的页面。这就是为什么有重复的调用。有没有人对如何解决这个问题有任何想法，这样它就不会发生？