我已经根据我的应用程序中的 jwt 令牌实现了身份验证。但是我在注销操作时遇到了一些麻烦。当我按下注销时，我只是从access_token 值中清除我的本地存储。
让我们想象一下，该用户使用我的应用打开了三个浏览器选项卡。其中一个是不受保护的，并且有一些未保存的用户输入（tab1）。其他选项卡（tab2、tab3）具有受保护的资源。当用户按下 tab3 上的注销按钮时，我想在登录页面上重定向他（因为他在受保护的选项卡上）。此外，当他激活 tab2 时，我想在登录页面上重定向他，因为它也有不受保护的资源。但我不想将他从 tab1 重定向（因为它不受保护），我不想更新它，因为用户会丢失他的输入。我该如何实施？
【问题讨论】：
标签： javascript angularjs authentication login single-page-application
TL;DR：为了实现这一点，您需要实现WebSockets。
一个用 Angular 编写的标准单页应用程序通过 HTTP 工作，根据wikipedia：
HTTP 在客户端-服务器计算模型中用作请求-响应协议。例如，网络浏览器可以是客户端，而在托管网站的计算机上运行的应用程序可以是服务器。客户端向服务器提交 HTTP 请求消息。服务器代表客户端提供 HTML 文件和其他内容等资源，或执行其他功能，向客户端返回响应消息。响应包含有关请求的完成状态信息，还可能在其消息正文中包含请求的内容。
请求-响应是计算机之间通信的基本方法之一。一台计算机发送请求，另一台计算机返回响应 - 就是这么简单（表面上。底层技术处理了很多东西，但它超出了这个答案的范围）。
但是，与任何（简单）技术一样，它也有其局限性。请求包含有关其发送者的信息。收到请求后，服务器会对其进行处理并向发出请求的实体发回响应。
您的应用打开了 3 个标签页，这里有 2 个问题：
假设您在选项卡 3 上注销。因为您使用 JWT 令牌身份验证（实际上任何令牌身份验证的行为都类似），正确的注销操作包括从您的本地存储中删除令牌在 SPA 项目实例中标签 3。在这种情况下，选项卡 1 和 2 中项目的应用程序状态不会改变。此外，注销不需要向服务器发出任何请求，因此不会发送响应以某种方式通知用户更改的身份验证状态。
即使您向服务器发送请求以通知它关于选项卡 3 上的注销操作，服务器也不知道其他 2 个打开的选项卡，因为该请求包含信息仅关于发出请求的实体，因此它只会向第三个选项卡发送响应。
注意：在继续阅读之前，我想提一下，我没有使用 websockets 的实践经验，所以你可以对我写的所有内容持保留态度。
再次，根据wikipedia（重点是我的）：
WebSocket 协议使浏览器和网站之间的更多交互成为可能，促进了与服务器之间的实时数据传输。这是通过为服务器提供一种标准化的方式来实现的，该方式无需客户端请求即可将内容发送到浏览器，并允许在保持连接打开的同时来回传递消息。通过这种方式，可以在浏览器和服务器之间进行双向（双向）正在进行的对话。
WebSockets 提供了一个full-duplex communication 通道，意味着服务器不仅响应客户端的请求，还发起数据传输。这解决了上面提到的第二个问题，留给您解决第一个问题的任务 - 通知服务器有关用户注销的信息。一旦服务器知道用户已经注销，它就会将此事实传达给所有其他客户端，从而在所有选项卡之间同步您的单页应用程序的状态。
Angular 不提供开箱即用的 websockets 支持，但有一些模块可以让您在项目中使用它们。谷歌一下就行了。
希望对你有所帮助。
【讨论】：