Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get currently logged in auth state/user from angularfire2

I have an ionic2 app and am using Firebase and angularFire2. I'd like to get the current authentication state and current auth object/user from firebase using angularFire2.

Here's what's working so far - I can authenticate the user and subscribe to the FirebaseAuthState to get the facebook user object.

  constructor(platform: Platform, private auth: FirebaseAuth) {

    auth.subscribe((user: FirebaseAuthState) => {
      if (user) {
        // I could store user in localstorage, but I'd like to see an All Firebase solution
        this.rootPage = TabsPage;
      } else {
        this.rootPage = LoginPage;
      }
    });

Now I can just set localstorage here and cache my user object to remember auth state. However, I am curious to see how I can use Firebase only without me implementing my own custom local storage key. I see that Firebase stores a localStorage key of it's own so knows that its logged in.

How can I get the auth object from code? Additionally, I tried the listed example in the AngularFire2 documentation to render the auth state in the template - but that gives me an error.

import {FirebaseAuth} from 'angularfire2';
@Component({
  selector: 'auth-status',
  template: `
    <div *ng-if="auth | async">You are logged in</div>
    <div *ng-if="!(auth | async)">Please log in</div>
  `
})
class App {
  constructor (@Inject(FirebaseAuth) public auth: FirebaseAuth) {}
}
like image 708
MonkeyBonkey Avatar asked Apr 19 '16 11:04

MonkeyBonkey


4 Answers

  1. Import: import { AngularFireAuth } from 'angularfire2/auth';
  2. Inject: constructor(public afAuth: AngularFireAuth) { }
  3. Check:

    this.afAuth.authState.subscribe(res => {
      if (res && res.uid) {
        console.log('user is logged in');
      } else {
        console.log('user not logged in');
      }
    });
    
like image 66
Csaba Avatar answered Nov 18 '22 21:11

Csaba


now in order to get the user info, you have to subscribe for getting the auth information. Ex

  constructor(public af: AngularFire) {
    this.af.auth.subscribe(auth => console.log(auth));// user info is inside auth object
  }

auth object will be null if auth state does not exist

like image 18
afmeva Avatar answered Nov 18 '22 19:11

afmeva


current authentication state is available from the injected FirebaseAuth. You can get the actual auth data auth.getAuth()

See: https://github.com/angular/angularfire2/blob/master/src/providers/auth.ts#L99

like image 7
Aaron Saunders Avatar answered Nov 18 '22 21:11

Aaron Saunders


You can simply import AngularFireAuth and do this:

this.angularFireAuth.authState.subscribe(userResponse => {
  if (userResponse) {
    console.log('here is your user data');
    localStorage.setItem('user', JSON.stringify(userResponse));
    console.log(userResponse);
  } else {
    localStorage.setItem('user', null);
  }
});

Here i am also using localStorage to save all data of my current user active on my app.

like image 2
Rohan Meena Avatar answered Nov 18 '22 20:11

Rohan Meena