A front end react app interacts with a legacy backend via an API gateway between them. It fires two requests –

1. /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;

2. /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 –

1. 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.
2. API gateway layer in turn calls the same underlying endpoint for each IFRAME.
3. 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?