A front end react app interacts with a legacy backend via an API gateway between them. It fires two requests -
- /api/login - where it passes LDAP credentials via API gateway to legacy backend and gets back a JESSIONID cookie in below format
Set-Cookie=JSESSIONID=1234ABCD567890EFGHIJKL;Path=/legacyPath;HttpOnly;SameSite=None;Secure;
- /api/work - where it passes the previously obtained JESSIONID cookie to perform some action in legacy backend.
This is working fine.
Now the requirement is to open front end app in 4 IFRAMES in one browser window so that 4 diff users can login at the same time. Since all 4 sessions will make same backend API calls, they will get unique JESSIONIDs but all having the same path. So the last received one will overwrite the 3 previous ones.
To make this work, can we do below step -
- Instead of each IFRAME calling /api/login and /api/work, make them call /api/frame"i"/* endpoints instead where "i" is diff for each IFRAME.
- API gateway layer in turn calls the same underlying endpoint for each IFRAME.
- API gateway layer takes the JESSIONID cookie received in response and changes the path to something like ";Path=/api/frame'i'" where "i" is diff for each IFRAME. Idea being that JESSIONID would be now attached to diff context paths rather than the same path.
Would this approach work? Or are there any changes to be done in front end app as well?
sessionStorage(that is unique per tab), and get it from there for every API request you make ...? (Would require how this is received on the server side as well, because you can't fakeCookieheaders with client-side requests, so you would either need to send it as a GET/POST parameter, or via a custom request header.)