http - 在 Angular 2 中的选项卡之间共享 sessionStorage 然后立即使用它？

Question

我已经知道的:

• 我可以使用该解决方案在浏览器选项卡之间共享 sessionStorage在这里找到:
  browser sessionStorage. share between tabs?

我用的是什么:

• Angular 2 (v2.4.4) 在 Angular CLI 基础上使用 TypeScript

实际问题:

脚本(在选项卡之间共享 sessionStorage)在 HTTP 请求之前在 Angular 中运行，但是当页面创建 HTTP 请求时，它使用 session ID(按顺序发送到服务器)识别 session )和 session ID 应该从 sessionStorage 中获取，但它还不存在。

当我打开浏览器的调试器控制台(在新选项卡上)时，sessionStorage 就在那里。因此，当我重新加载这个新标签时，一切正常。 但问题是 sessionStorage 是在 已尝试使用 HTTP 请求后设置的。

上面链接的解决方案确实在 HTTP 调用之前运行，但事件 调用发生在 HTTP 调用之后。我从上面的链接代码中考虑特殊的sessionStorage_transfer:

window.addEventListener("storage", sessionStorage_transfer, false);

我这样存储 session ID:

get sid(): string {
    return sessionStorage.getItem('user.sid') || '';
}
set sid(value: string) {
    sessionStorage.setItem('user.sid', value);
}

所以最终 sid 收到值，但就在 HTTP 调用已经尝试使用它之后，尽管脚本(共享 sessionStorage)在任何 HTTP 之前开始运行打电话。

(如果没有解决方案，那么我将单独为 sid 使用 session cookie，但我希望有人知道解决方案。也许是 Promise、Observable、Subject 等等？)

感谢您提供解决方案! :-)

Answer 1

保留 here 中的代码在您的 Angular 网络应用程序的 index.html 中的正确答案中提到。它对我有用。