How to handle the User Authentication session cookies in angularJS app?

Question

New to AngularJS web development. Currently, I have an application where I have to use the global authentication form. The SPA has multiple partial pages/views. To navigate from tab to tab, I am using ngCookies to store the customer login information.

If the user refreshes the page, I read the cookies and bring the related information for a given customer.

It is working fine but the problem arises when the user closes the application without clicking the logout button and the cookies remain in the browser.

So, the next time another customer logs onto the site, it reads the old cookies and bring the old customer information instead of currently logged-on user.

function writeLoginCustIDCookie(loginCustID) {
$cookies.put("LoginCustID", loginCustID, { path: '/' });
}

function getLoginCustIDCookie() {
return $cookies.get("LoginCustID");
}

Please help me out how to solve this issue.

yBrodsky · Accepted Answer · 2018-09-12 12:04:10Z

1

You will have to configure a flow. What I do is this:

Let the browser handle the cookies. When your server replies with cookies, the browser will set them.
Since the browser handled the cookie, all you need to do is add withCredentials: true to your http requests, so that cookies are sent.
Now, the user information; when you login, you probably get some response from the server containing the user information. I generally save that to localStorage. That information is NOT sensitive data. Just some basic info.
When the user clicks logout, you remove the localStorage data and you dispatch a /logout request to the server.
If the user doesn't logout, closes the browser and he comes again....well he will be logged in. That's what happens with most sites. He will be logged in until the cookie expires.
If the user comes back after a week, lets say your cookie expired. You will make some request to the backend, the backend will reply 401. Here you catch this error, delete the localStorage data and redirect him to the login page.

This is what I generally do. Nothing crazy I think.

answered Sep 12, 2018 at 12:04

yBrodsky

5,0614 gold badges24 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Alomoni Over a year ago

@hBrodsky, what is the difference between localStorage and ngCookies. Based on my reading, you have to delete manually for both otherwise, they stay forever. I am contemplating to add the expiration time when I write the cookie(say,20 minutes something like that). Can you use withCredentials for http get request? Currently, I make a http request to get the authentication information during initialization from the MVC controller,creates a session object inside MVC controller and sets the cookie values such as userName,userID in the client side.

yBrodsky Over a year ago

cookies expire if you set them time to. LocalStorage doesnt. Yes you can use withCredentials on any request. Cookies you just set / get them on the server. If you are using some session handler you don't even have to worry about that. Localstorage is just to store some data

Collectives™ on Stack Overflow

How to handle the User Authentication session cookies in angularJS app?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related