Angular中的身份验证：处理新标签页或新浏览器窗口

Question

我的基于AngularJS的应用程序旨在使用localStorage来保存身份验证后从后端返回的JWT身份验证令牌。对于进入后端的每个请求（POST，GET等），应用程序使用拦截器将令牌搭载到后端。这个过程一直运行良好，直到遇到以下问题：

1. 我的经理不允许使用localStorage保存用户名和JWT身份验证令牌，因为他们会在浏览器中保留，除非他/她故意退出应用程序（从localStorage清除缓存） ）。如果用户在未注销的情况下关闭浏览器，则缓存将保留在localStorage中。

2. 因为问题1，我转而使用sessionStorage来存储用户名和JWT身份验证令牌，但是，当用户右键单击某些链接以打开应用程序时，这会导致更多问题新选项卡或新浏览器窗口。在新的选项卡/窗口中，应用程序无法看到用户已经过身份验证，并且发送到后端的请求被拒绝（401 error），因为应用程序在新选项卡/窗口中找不到sessionStorage中的JWT身份验证令牌

3. 如果我将用户名和JWT身份验证令牌缓存为JavaScript代码中的变量，那么如果用户刷新浏览器，应用程序就会丢失它们。

所以这些是我在角度中使用JWT身份验证令牌的困境。是否有更好的解决方案来处理要求：不使用localStorage，应用程序应在新选项卡或新浏览器窗口中继续使用相同的auth JWT令牌。谢谢！

Answer 1

这更像是角度/服务器设置中的设计缺陷，而不是简单的令牌问题。

通常，当用户在新窗口/选项卡中打开链接以启动干净的新会话时。 URL将指向需要身份验证的内容，并且由于它是新会话，因此角度应用程序应尝试恢复它。用户已使用记住我登录，或者系统会提示他们输入用户名/密码。成功验证用户后，应使用重定向恢复URL。

所以它的工作原理就是这样。

http://example.com/page1 <-- user uses ctrl+click to open new tab
http://example.com/page2 <-- user doesn't have session
http://example.com/signin?url=/page2 <-- redirect to sign in with return path
http://example.com/page2 <-- user session restored after sign in

用户启用记住我功能时，可以跳过登录步骤。

将会话令牌存储在localStorage中与没有会话相同。由于在重新启动浏览器时将恢复令牌。那安全性是什么？

Answer 2

您是否尝试过在域的 cookie 中设置 JWT。这样，如果设置了 cookie，它将包含在您从应用程序触发的每个 GET/POST 请求中，并解决您的新标签或新浏览器窗口问题。