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

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.

Related

Login page go directly to cache because of cookies

I have a login button that opens a new window to a third-party login page. If i. Logged in first time, any time i refresh the page or open the website in a new tab when i click on the button it redirects me to the cached login response data, and i have to clear both my website and the login website cookies completely(website+external ones(google cookies.. etc))..
So is there is a way to force clearing all website data from javascript? Or any way to avoid this caching issue?
I have already tried to delete document.cookie but it only delete only the domain cookie not the external ones.
Generally, an app with a third party authentication flow is like from your app, you check the credentials in your cookie to see whether they are valid.
If they are not valid or do not exist, open the third party authentication dialog then login. After a successful login, mostly, the 3rd party auth should saved something in the cookie with its domain. And you also need to save something about credentials in the cookie.
If there are valid credentials in your cookie, then you are simply authorised and the credentials in the cookie should be good to use.
Back to your 2 questions, So is there is a way to force clearing all website data from javascript? Or any way to avoid this caching issue?
Why do you need to clear those data for the sake of authentication?
For the second question, I think I answered it already with the general introduction.

Overwrite Referral Variable

My website's landing page redirects to authentication provider domain [not controlled by me] where credentials are entered and on success returns to reach Home Page (back to my domain).
All this is fine except if I check the referrals of HomePage on Adobe Analytics it shows me the URL's from authentication domain only. I understand Adobe uses javascript 'r' variable to populate, how can I re-populate it with original referral?
In general, you can override the reported referring URL by populating s.referrer
Ideally the auth server's redirect directive or server-side scripting in general should be configured to carry over the original referrer.
But you said you don't have control of that server, so your only other option is to push the current url to a cookie and then read the cookie on next page view and push that to s.referrer.
But.. this may not be a perfect solution for you, depending on how exactly your site flows.

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.

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

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?

Categories