AngularJs Application - 几个浏览器选项卡

Question

我在AngularJS中开发一个应用程序，这里是上下文：

• 我使用OAuth2并将令牌存储在localStorage和变量
中
• 每次令牌快要过期我刷新变量中的令牌，然后更新localStorage令牌

我遇到了问题：

• 如果我使用相同的应用程序打开一个新的浏览器选项卡（按住Ctrl键并单击一个链接），则2应用程序将刷新令牌，其中一个被解除连接

这是我的问题：

• 使用相同的localStorage令牌在同一浏览器中处理多个angularjs应用程序的最佳方法是什么？

我想象的解决方案是在应用程序启动时生成唯一ID（当前时间戳+随机值），并使用该ID标识每个选项卡。问题是我在localStorage上有并发性，如果2个应用程序同时读/写，它们可能会写入另一个应用程序写入的数据。

Answer 1

一种选择是不等待令牌过期。但是在它到期之前的一段随机时间（例如，在启动应用程序时可以生成的数字）。

然后，当其中一个应用程序到达该时间点时，它会从服务器请求一个新令牌并将其存储在localStorage中（以及更新$ http标头或您正在使用的任何内容）。

你的应用程序也应该监听localStorage中的更改，像这样，其他选项卡将被通知新的令牌可用，并且应该更新其变量以及$ http标头（或者无论你使用什么）。< / p>

确保在制作随机函数时，确保时差很重要（不是几秒钟），否则您仍然可以请求2个令牌，因为另一个标签仍在等待响应。