New tab opens login page even though already logged in another tab - javascript

I am new to web development and I am trying to implement log in functionality. I have successfully implemented the log in functionality. When I open www.bla.com/login I am able to log in post which gets redirected to the homepage.
Problem: If open another tab and type: www.bla.com/login it again opens login page. Ideally if I am logged into one of the tab, I should be redirected to homepage irrespective the url being pointed to login page.
P.S: I am not sure what chunk of code I need to share here because I am not sure what causes this issue. Please help or let me know if I need to post my code base. I am using JavaScript and backbone as front end.
EDIT
I have a REST Service which gets hit when I login and REST service gives me back a User Specific Token. I use this user specific token to again call another Rest Service to fetch more user specific data.
So, basically I need to put a check on this token received. The token received I have stored in browser session. But when I go to another tab and try to access that token its NULL. So I am assuming every tab in browser does not share the session storage. If Yes, then where shall I place this Token so that if someone hits the login page I should check whether a token already exists. if exists then redirect to home page. Kindly guide.

It is hard to say without seeing your code, so let me make an educated guess:
Most likely you do not create cookie with some sessionId after user is successfully logged in.
This cookie would be then used in every request sent to the server, to prove that user is indeed authenticated.
When you open a new tab and there is no cookie/session created, than this new instance of application has no knowledge of the other instance, where user is already logged in.
You may want to look at this answer
EDIT
Maybe you are using sessionStorage instead of cookies. At least I would say so, when I read about behaviour of your app.
See the docs for session storage
The sessionStorage property allows you to access a session Storage
object. sessionStorage is similar to Window.localStorage, the only
difference is while data stored in localStorage has no expiration set,
data stored in sessionStorage gets cleared when the page session ends.
A page session lasts for as long as the browser is open and survives
over page reloads and restores. Opening a page in a new tab or window
will cause a new session to be initiated, which differs from how
session cookies work.
So make sure that you application store the token either in cookies or in localStorage. And also that it correctly reads from them. Maybe the cookies is created, but never read?

Related

How to handle session for accidental tab closure (tab/browser close or PC shutdown)

I have a requirement to have only one active session per user in my application. Currently, I'm using sessionId and storing it in sessionStorage as well as in a database for the logged in user. Whenever the same user tries to log into the application from another tab or browser, I'm comparing the sessionId and also checking if the session is already active for that user or not using sessionId (I'm using Apache Shiro for session management), if yes, then they get redirected to invalid session page, otherwise if the session is invalid, the user can proceed with the login (clearing sessionId on logout action).
Now, I have one situation, when the user logs into the application and accidentally closes the browser or tab with active session or user PC gets restarted, then they cannot log into the application till the old session gets timed out (user session times out after 15 mins of inactivity). I want to allow user to login if active session tab gets closed accidentally. Is there any way I can handle this situation?
HttpSessions are not linked to tabs, they are browser scoped. If a user tries to login from an other tab, you known it has an active session within that browser. So in that case simply do not offer a login form.
If a tab is closed, you might have other tabs open which use the session, so it would not make sense to invalidate a session on closing a tab.
You cannot detect and act on a PC shutdown. So you will never get what you want to be bulletproof.
I would implement it like this: if a user tries to log on, and there is an "active" (recent) session in the database, warn the user that an active session is found and that continuing will invalidate the other session(s).
See also:
How can I load Java HttpSession from JSESSIONID?
Since you've tagged the question with PrimeFaces, you might want to check out p:idleMonitor. It can help you to invalidate inactive sessions from the client side.
See also:
Timeout via PrimeFaces p:idleMonitor
Primefaces Idle Monitor when multiple web pages are active in multiple Tab of Browser

MSAL.js How to access SID received in other tab?

I'm trying to implement MSAL in a client side library, which works pretty well so far.
Now for my next steps I'm trying to add SSO by following the documentation at https://learn.microsoft.com/en-us/azure/active-directory/develop/msal-js-sso#automatically-select-account-on-azure-ad
In this documentation it is pointed out that I can add the sid claim to the auth requests, and reuse that sid in my second tab when logging in.
Now my main question is: what is the process to access the sid retrieved in tab A, and then re-use it in tab B?
I'll summarize for anyone else that is running into this sort of situation. The traditional way to store login tokens is in a cookie. This works fine for most scenarios- if the user tries to login to a different site on the same domain, the cookie is picked up. If they are signing in to a different domain, they will still need to visit the login page, but instead of entering their credentials they will simply be issued a new cookie for the new domain.
The question posed is for a special case when attempting to obtain a cookie on one tab, then using it on another tab without refreshing the page in the second tab. In this case, the token must be stored in local storage in order to be accessible to the code in the second tab immediately.

Send JWT token to server upon initial browser request (using local storage)

Okay, let's say I have a login page where when the user logs in he or she gets a JWT token from the server which is then saved in local storage (I know cookies is better but I want to do it with local storage). After that, imagine I quit my browser (token is still in local storage and in this example has no expiration date). Now what I want is the following: After quitting the browser (but I got successfully logged in and have token in local storage) how do I make it so that upon initial request to the same server I don't get the login page up again but instead have the user already signed in? Taje into an account that I am able to authenticate the user after the first request and I am aware how but How do I send the token in the initial request?
There may not be a direct solution to your requirement.
But, One hack can be added by adding Script in Head tag.
And withing this script you check if localStorage.getItem('key') is present or not.
If value is present send the request to Home Page directly along with Token or else Login Page.
But, this script download is extra server round-trip.

Web page authentication and sessions

I'm trying to understand how most online websites authenticate and then store your session. What I'm particularly trying to understand is when I log into a website it starts off by redirecting me to the login page and then validates my username/password, then navigates back to where I started but with my information displayed. If I were to navigate away from that webpage and then come back to it sometime later I'm still logged in. I feel like this is what a cookie could be used for but I'm looking to see if anyone could provide me with a good explanation as to how this works?
A cookie is a bit of data stored by the browser and sent to the server with every request for instance a subscription status on a website.
A session is a collection of data stored on the server and associated with a given user (usually via a cookie containing an id code)
Session values are reset after the connection is closed. Cookies values are normally saved.
Session values are usually reset after a period of time has passed without a connection from the client with which the session is associated. Cookie values are saved until their expiry time (or the browser is closed if one isn't set). Expire immediately overrides are available for both

How to pass token to new tab in same browser (Login Issue)

I am learning web development and implementing the login functionality. I have a rest service which generates a unique token for each user which logs in. Now I had one issue if I log in one tab and go to homepage and if I go to another tab, instead of getting redirected to home page I was getting redirected to log in page again in the new tab. Ideally, if I go to another tab I should get redirected to home page. It happened because I was saving unique token in session storage. But I realized that session storage is per tab basis so now I am saving the token received from Rest service in local storage.
Below is what I did:
Before redirecting to login page I am checking if token exist in local storage
if((localStorage.getItem('p_kt')))
window.location = "pages/firstDashboard.html";
If token does not exists normal login code runs and I get the token from REST Service
localStorage.setItem('p_kt', self.get('tokenProp'));
Also, when some one logs out I do:
localStorage.clear();
So everything seems to be working now. But I doubt its the right way to fix the issue. Can someone guide me. Is it okey to keep token in local storage.

Categories