How to maintain state of an app after a refresh, AngularJS? - javascript

I'm trying to make a basic social networking application following Write Modern Web Apps with the MEAN Stack book.
The end result should be: https://mean-sample.herokuapp.com/
I got through to getting user accounts set up, having a user log in and create a personalized post. But as soon as I refresh, the user gets logged out.
What am I doing wrong? And how do I fix this?

In the client side we cant maintain the session, we need the server support to it. There are many ways to maintain the session
1 Token based, for each request to the server, the server will check whether token exists or not.
2 We can store in the localstorage while refresh the rootscope will be, at that time we can take from local store and populate the page objects.
Maintaining in server side is secured and advisable.

use localstorage, it will help you in maintaining the session and also store user details temporarily.
Refer this for more details
https://github.com/grevory/angular-local-storage

Related

How to authenticate a react-native app offline

Am trying to make an app that runs both online and offline but i want my user to be authenticated or to be logged in once. So after the initial login i want them not to be able to see the login form again, i want to show them a new part of the app. They should be only to see the login form only when they decide to logout. My problem is that it would have been easier for me to do this if they are always online but they might be offline too so i just need them to login once and next time they boot up the app they wont see the login form again rather they would see something else.
There is no authentication offline. Authentication is made so that the server-side makes sure it is used by a given identity because you can never trust the client-side. If there is no server-side, there is no authentication process.
If you just want to let the user use your application, even though he is online, why don't you store a local copy of the user profile within the local storage after a successful authentication? (with only non critical data of course).
This way, your application can rely on its memory to fetch the user profile and not the server while it is offline.
You could save an kind of "userIsAuthenticated"-Flag to local storage (see https://facebook.github.io/react-native/docs/asyncstorage.html).
Based on this flag you could decide which screen the user see on startup.
But be aware, it could drive your Users crazy, if they have allways to relogin, if the network-connection (maybe cause of bad 3g/4g) was Interrupted.
You also give a notice if a user is offline, that they have to be online to use this app.
BTW: To request if a user has Network-Connection you can use: http://facebook.github.io/react-native/releases/0.48/docs/netinfo.html#netinfo.
Don't forget to set permissions in AndroidManifest.xml to be allowed to use the request.

Best way to keep authenticated user profile in Angular2

I am using Angular2 & Auth0 to Authenticate a user.
Currently, according to their "best-practice" , the user profile is saved to localStorage , and once you need to pull information, take it from there.
This sounds like a bad practice to me, is there a better way to keep logged in profile for local query (name, photo etc.)? maybe using an Angular2 service?
The problem is if you want to keep the user profile for later use (if the user close the window and reopen it later) without having to make request to a server. Then you need to store it somewhere.
And storage facilities in the browser are quite limited: IndexedDB for database storage with query capabilities, indexes, etc, localStorage for simple key=>value storage,or even cookie for a limited amount of data as plain-text.
but if you don't need the data for a later use, you can keep it in memory (in a service, for example).
You can also combine both in-memory and offline-storage in a service.
You can combine both ways.
Storing it in localstorage to get that infos without request them anytime and wrapping a Service around it to not address the storage from everywhere.

Cordova Persist Session on iOS

I'm having trouble figuring out how to persist a session on an iOS Cordova app.
I'm using Node.js/Express on the backend and Angular on the front-end. My onboarding processes work properly and everything is dandy until the user closes the application. When it is reopened, the user has been logged out.
I understand WHY this is happening, but I'm having trouble figuring out how to prevent it. Can I use local storage to store and retrieve a cookie? If so, what's the preferred method?
I believe you could use whatever value you want in LocalStorage, as long as you don't get messy with multiple users using the app.. Just check for that value when the app starts and do the magic for user already logged in.
If you want to add more security, perhaps you can save a token in LocalStorage, when the app starts, retrieve that token and compare it against your backend, to check if it's active or not, after that, more coding magic :)
The second option will make the user's workflow a lil bit more slower due to the app request and the server response.
What data should you save? That's up to you, depending on your app, what it needs to 'boot'. If you use a token, you can send the needed data in the server's response.
There should be always something that identifies that user on the server, and not only his username or id, I believe you use something to tell the server that THIS USER is logged in while the app interacts with the server.
Some data about LocalStorage: https://cordova.apache.org/docs/en/4.0.0/cordova_storage_storage.md.html
PS: If you are already using AngularJS, you should check Ionic Framework and ngCordova.
Good luck!

Can I save client side state in javascript?

I have several web pages that should work only if certain condition is true. For example, there is a registration page, a login page. If someone is already logged in, I don't want the user to login again or register again until he is logged out. Currently the server saves the login in a SESSION variable and each web page has to called the server to get the SESSION variable and determine whether to display the page or not. This does not seem like a good solution. I am thinking may be saving in on the client side, but I don't know a good approach. Should I use cookie for this ? Is there some other services on the client side to store session data ?
Cookies are the best option for session details involving login, any other persistent storage should use localStorage.
This is because cookies will be transferred to the server on each request and therefore can be used to authenticate each call.
If your confused about this sort of stuff it can be very dangerous for your site. Try read up on it and try to use whatever the standard is for your language/framework/library.

Why isn't my Javascript setting the right cookie?

On my application, a session is created whenever the user is logged in, and this session is updated on the db and session is saved on cookies as well (using perl)
Now I modified the code to update the session using javascript. However when I log out then in again, the session found in the database is different from that found in the cookies. For some reason the cookies is not being updated using Perl after it is being updated using javascript. I don't what wrong I'm doing.
In javascript I do this:
createCookie(cookie_name,cookies_value);// where cookie_name is same as the one on Perl
Any help?
Sessions are normally lost when you log out of a web app, so it's expected to get a new one when you log in again. Without knowing your session implementation and login/logout code, there's no way of knowing if that's the cause of the issue.
What cookies are sent with the request? Which cookies are stored by the browser? Verify everything by inspecting the HTTP transaction, etc. then tell us what you find. Be a lot more specific than "It doesn't work".

Categories