My Current Knowledge:
- I have discovered a way to share
sessionStoragebetween browser tabs by using the solution provided here:
browser sessionStorage. share between tabs?
Tools I Am Using:
- Angular 2 (v2.4.4) with TypeScript on Angular CLI base
The Issue at Hand:
In my Angular script, which enables sharing of sessionStorage between tabs, runs before HTTP requests are made. However, when a HTTP request is initiated, it requires a session id from sessionStorage which may not be available yet.
When inspecting the browser's console in a new tab, the sessionStorage is present. This discrepancy causes problems as the sessionStorage is set after the HTTP request has already been attempted.
While the linked solution executes before HTTP calls, the event calls come after HTTP interactions. One potential solution would involve utilizing sessionStorage_transfer as shown in the referenced code snippet:
window.addEventListener("storage", sessionStorage_transfer, false);
To store the session id, I have implemented the following:
get sid(): string {
return sessionStorage.getItem('user.sid') || '';
}
set sid(value: string) {
sessionStorage.setItem('user.sid', value);
}
Despite eventually receiving a value, the sid variable gets set only after the HTTP call has been attempted, even though the script for sharing sessionStorage starts running beforehand.
(If no immediate solution is found, I may resort to using a session cookie solely for sid. However, I am hopeful that someone might suggest a solution involving a Promise, Observable, Subject, or other approach.)
Thank you in advance for any insights and solutions! :-)