How to handle firebase authentication on vue - firebase

I’m working with a vuejs project and I’m using firebase oauth authentication.
I’ve already implemented the sign in with popup flow, and the auth state change event listener, it works pretty well.
The thing is, after I sign in, when I refresh/first load the application, as the auth session persists, there’s a time span between the app load and the auth state change is triggered, so even though I’m logged in, I see the login screen for a few seconds before the event is fired and I get redirected to the main page
For example
I open the application
As I’m not authenticated, I get redirected to /login
I see the login screen
I sign in using the google provider and the popup
I get redirected to the main page /
I refresh the page
I get redirected to /login
As I was already authenticated, the authStateChange event fires and I get redirected to the main page, but this happens after a couple seconds
There’s any way to handle that previous state to be able to show a “loading...” or something? I’ve been reading the docs but the only thing I found is using the event listener that I’m already using
Thank y’all in advance!

Okay y’all, this is the solution I came with:
There’s no way to know if an user will ve logged in until it gets actually logged in and the authStateChange event fires. So the best I could do is, when the user logs in into the application, I store a “EXPECT_LOGIN” value in localStorage, so if I reload the app, and that value it’s true i show a “Loggin in” message with a timeout of, say, 5 seconds. Here we have two possibilities:
The event is fired and the user is logged in automatically
The timeout is fulfilled and I set the “EXPECT_LOGIN” value to False, then I let the user login manually

Related

Will FIRAuth.addAuthStateDidChangeListener wait until the end of the initialization before calling the listener?

The documentation of Firebase Auth for iOS regarding the addAuthStateDidChangeListener function states:
Registers a block as an "auth state did change" listener. To be invoked when:
The block is registered as a listener,
A user with a different UID from the current user has signed in, or
The current user has signed out.
The block is invoked immediately after adding it according to it’s standard invocation semantics, asynchronously on the main thread.
The first point above and the last paragraph confuse me. If I add a listener immediately after having initialized Firebase, is it possible for the listener to be called before Firebase Auth have restored the user from a previous session?
In such case, how can I distinguish if the call of the listener with a null user occurs because there is no user or because the user has not been restored yet?
It is indeed possible for the auth state listener to be called before the authentication state has been restored, in which case the listener will be called with a "user is not signed in" state initially, before being called with a "user is signed in".
The Android SDK these days actually hides that first auth state, but I don't think the iOS SDK does the same. You might want to give it a try though. Simple sign in to the app, close the app, wait for at least an hour (so that your access token has expired) and start the app again.
I'm not sure how most developers handle this, but I know of these two ways:
Make the redirect to the sign-in page explicit. So if you get an auth state without a user, show a link to the sign-in page. In the scenario with the initial "not signed in" that means the user will see this page for a moment, until the sign-in state is restored.
Make the redirect wait for the refresh. This is essentially just a time-out with something like "detecting sign-in state" or something similar. You might want to include a explicit redirect link in there too, for users who know they won't be signed in.
I agree that neither if these is ideal in a mobile app, so I am curious to see what others do.

How does emberfire maintain authentication sessions when restarting the app?

This is a very noobie question, but there is something I don't really understand.
Whenever I have an authenticated session with emberfire, I'm able to stay logged in, even if I do something like refresh the page or go hit the back button on my browser. The reason I find that strange is because Ember is a single page application. That means by hitting refresh I'm essentially restarting the app and I feel like I should be losing all my sessions and states. How is it then that my login state is preserved even when I refresh the page? Shouldn't my login information be lost when refreshing?
Firebase Auth persists the auth state in web storage (localStorage/IndexedDB). This is the expected behavior in most apps. Many users expect their state to persist and not be forced to login each time even for single page applications. If you wish to persist your state per session (until the window is closed), sessionStorage is ideal for that. Firebase Auth team is looking into that.

Best way to tell a user they've been signed out due to inactivity in using FormsAuthentication?

I'm working in Asp.NET MVC, and am trying to display a message to the user on the login page to inform them they've been logged out. I've got a Client side timer event which essentially fires a request that kills the Forms Authentication and Abandons the session, then forces a page reload which fires the FormsAuthentication redirect to the login page.
It's working pretty well overall, but I'm wondering how I can display a message to the user on the login page to say why it is they've suddenly been redirected. I was storing a flag in TempData, but now that I'm needing to clear Session as well that's not being retained.
I'm currently just loking for a returnUrl in the querystring which is ok but not great - is there a better way to detect to pass a message through that the user has been logged out?
Thanks in advance.

Get reason for login prompt when using asp.net membership

I have an asp.net website using the SQL ASP.net membership system. When users are logged in to the website and are inactive for 20 minutes, they get sent to the login page on the next page request. I would like to show some text on the login page that says "you were logged out due to inactivity" when this happens. Is there a built-in way to do this? Or any other ways I could distinguish why the user has been sent to the login page (for inactivity or some other reason)? I have scoured SO and Google but haven't been able to come up with anything.
The reason we need to do this is because we recently migrated from a previous version of the website that was lax about security and didn't have auto logout, so we're getting lots of feedback from users thinking there's something wrong with the website when they are prompted to login again.
Thanks in advance.
It is better to use javascript for this and be proactive about it, showing the timeout remaining if possible otherwise just alerting the user with a messagebox showing that his session has timed out and then redirecting him to the login page. Have a look here for a simple example.
To redirect him to the login page add the following to the below line as in the example:
alert("Your current Session is over."); window.location = "YourLoginPage.aspx";
For purposes of closure, I'll answer my own question. I couldn't find a clean way of doing what I'd like, so I ended up setting a cookie with the login time after the user logs in. Then on the login form page, I see if the login time in the cookie is greater than 30 minutes old (my auth timeout in asp.net) and display a "logged out due to inactivity" message. Otherwise it doesn't display the message.
Not great, but it seems to work. Satisfies the requirement for the vast majority of our users.

How to get a channelSet to be authorized when a session already exists without calling login

In my Flex application, channelSet is reset on each browser refresh. If you've authenticated and refresh the page and check channelSet.authenticated, it says false, but your remoteObject calls will still work because the server session still exists.
I have a service call that checks for a session on the server and can identify that one exists when a user has already authenticated and not logged out, but how can I bypass login and still set the channelSet.authenticated to true without calling channelSet.login() when they come back to the page(before a timeout occurs, of course)?
UPDATE:
The user session isn't closed if you exit the browser. Currently it does in fact make you log in again. But there is an existing session so blazeds returns a re-authentication error if you're not the user in the session, and it also allows you to login with any password if you are the user because it sees that the session has already been authenticated.
So how can I make it so the session is invalidated upon closing the browser or refreshing? I could do it by automatically logging out when the app starts, but that doesn't seem very elegant.
alternatively I could do something like this:
<body onunload="MyFlexApp.myFlexFunction();">
and call logout automatically when they leave the page.
What's the proper way to handle this?
But they haven't authenticated... how can you be sure that the person using the app now is the same person as before? Closing the browser is supposed to be a good way of breaking a link with an application. If the next person in the internet cafe can get access simply by going to your page, that breaks security somewhat doesn't it?
That's why, even if there's a current session, you should force re-authentication.

Resources