Ionic2 如何在ionic 2中实现登录流？

所以我正试图从ionic 1开始学习ionic 2，需要一些关于如何在我的项目中设置身份验证的指导。具体来说，我使用的是firebase和angularfire2

一般而言，我应该：

a。检查app.ts上的session/localStorage，如果未经身份验证，则将rootPage设置为login？使用此方法，如果我注销用户并将nav rootpage设置回登录，则选项卡将显示在底部

b。将登录页面创建为一个模式，这样可以消除底部出现选项卡的问题，但我不确定是否应该从app.ts启动该模式，因为我不确定应用程序本身是否应该引用根视图

另外，我是否应该将auth login和logout设置为一个服务，并对其进行重构，而不是将其放在登录页面和概要文件控制器中的logout按钮中

到目前为止，我使用方法A的逻辑如下：

app.ts

export class MyApp {
  rootPage: any;
  local: Storage = new Storage(LocalStorage);
  constructor(platform: Platform) {
    this.local.get('user').then(user => {
      if (user) {
        this.rootPage = TabsPage;
      } else {
        this.rootPage = LoginPage;
      }
    });

    platform.ready().then(() => {
      StatusBar.styleDefault();
    });
  }
}

在myProfile.ts中

  logout() {
    this.local.remove('user');
    this.user = null;
    let modal = Modal.create(LoginPage);
    this.nav.present(modal); //should I set the rootPage instead?  if so how do I remove the tabBar or set the rootpage of the containing app root page
  }

---

以下是ionic登录流的一个示例，其中jwt存储在本地存储器中：

a。检查app.ts上的session/localStorage并将rootPage设置为 如果未经验证，是否登录？如果我注销用户并 将nav rootpage设置回登录，选项卡将显示在 底部

您可以使用Angularfire2 Ionic Provider，有关详细信息，请访问此链接

最后是注销使用

---

这将不会在底部显示选项卡。

我已经提供了您所问问题的答案

import { Observable } from 'rxjs/Observable';
import { Injectable } from '@angular/core';
import { AngularFireAuth } from 'angularfire2/auth';
// Do not import from 'firebase' as you'll lose the tree shaking benefits
import * as firebase from 'firebase/app';

@Injectable()
export class AuthService {
  private currentUser: firebase.User;

  constructor(public afAuth: AngularFireAuth) {
    afAuth.authState.subscribe((user: firebase.User) => this.currentUser = user);
  }

  getauthenticated(): boolean {
    return this.currentUser !== null;
  }

  signInWithFacebook(): firebase.Promise<any> {
    return this.afAuth.auth.signInWithPopup(new firebase.auth.FacebookAuthProvider());
  }

  signOut(): void {
    this.afAuth.auth.signOut();
  }

  displayName(): string {
    if (this.currentUser !== null) {
      return this.currentUser.facebook.displayName;
    } else {
      return '';
    }
  }
}

constructor(public authService: AuthService) {
     let authState = this.authservice.getauthenticated();
     if (authState) {
        this.rootPage = TabsPage;
      } else {
        this.rootPage = LoginPage;
      }
  }

import { App } from 'ionic-angular';
constructor(
      public appCtrl: App
    ) {}

    setRoot(Page:any) {
      this.appCtrl.getRootNav().setRoot(Page);