#Auth State Persistence across Components

20 messages · Page 1 of 1 (latest)

storm blaze
#

What's not working for you now, and why you implemented it this way?

dull kestrel
#

i have implemented Auth using firebase Auth and i'm not sure how to persist loggedIn user state asynchronous in other views. LoggedIn state getting changed when the page is refreshed after login or before login which effects the appearance of logout button in the navbar. I'm not sure of how to properly implement loggedIn user state like using accesstoken to determine where user needs to login again and how to store it in localstorage. Any articles on how to implement loggedIn user state and how to properly store the user data might make it much easier as i am not aware how to properly implement this. Any examples would help a lot. Thanks in advance

storm blaze
#
  • You're probably following some old tutorial, because class-based guards are deprecated. You should use canActivateFn these days
  • That implementation looks strange: what's the point of isLoggedIn?
  • If for "page is refreshed" you mean the browser refresh button, alt+f4 or alike, that has nothing to do with the guard, but just with the fact that a whole page refresh will reset the state of the app, so if you don't store the loggedIn state in some persistent storage, the button will always see it as its default value
  • On top of all
#

g!auth @dull kestrel

warm oasisBOT
#

Hi @dull kestrel, we do not recommend implementing your own Authorization/Authentication solution.
From experience, we know that Auth is a complex subject and an incorrect implementation could compromise an entire project.

An Auth solution complying with industry standards like OAuth2, OpenID, SAML, etc., requires extensive knowledge and a substantial amount of development time to implement and maintain.

We advise projects requiring Auth, to use a recognized third party Identity Provider (including, but not limited to: Auth0, AWS Cognito, Keycloak, Okta, etc.)

Many of these Identity Providers offer a free tier, which is suitable for use during development or for use in smaller projects.

storm blaze
#

Just realized you're working with firebase Auth, so drop the last suggestion I triggered by the bot

#

My bad.

dull kestrel
#

IsLoggedIn behaviour subject is used to get whenever user state when user logins or out .

storm blaze
#

I mean this property isLoggedIn = false;

dull kestrel
#

Sorry in Authguard I add that isLoggedIn property again since i'm not sure loggedIn value from AuthService is properly getting updated in Authguard. When the page is getting refreshed the isLoggedIn value is getting effected

#

What i want is how is to properly implement isLoggedIn as an observable for user state and use it for both AuthGuard and logout button
Here is the link to the hosted site
https://monster-cd4a6.web.app/login
Just signup with random mail and sigin into the site and refresh the page. You can see issue i was referring to

dull kestrel
#

@storm blaze Please take a look at the site. Just signup with random mail and sigin into the site and refresh the page. You can see issue i was referring to with logout button and authguard.

storm blaze
#

What tutorial did you follow?

dull kestrel
#

not one in particular since most of the earlier firebase imports are deprecated i did it on my own

storm blaze
#

I don't need to test it.
I got your problem.
But there are many errors in your code.
I suggest to you to look for a guide online. Unfortunately I cannot link anyone really updated.

dull kestrel
#

You link any articles on how manage loggendIn user state once after he logins or out of the application. Even if it is old send me because i can try to make sense of it and do it on my own

storm blaze
dull kestrel
#

Thank you this really helps in recent angular fire i can’t find authstate method. Even in docs I can’t find any other method that is an observable to get the authstatechange

IMG_2661.png
storm blaze
#

I'm quite sure it's the other way around.
Check your version of angularfire