当用户单击链接时，如何通过请求将身份验证令牌从本地存储发送到后端

Posted 2023-03-05

【中文标题】当用户单击链接时，如何通过请求将身份验证令牌从本地存储发送到后端

【英文标题】：How to send auth token from local storage to the backend with the request when the user clicks a link

【发布时间】：2021-11-20 16:13:36

【问题描述】：

在我的系统中，当用户登录时，他会收到一个 JWT 令牌，该令牌将存储在 本地存储 中。此外，由于他现在已登录，一个新链接（只是一个普通的锚链接）将显示在通向仪表板的导航栏中，另一个将显示在其他地方以供退出，依此类推。 现在，由于令牌存储在本地存储中，并且仪表板链接只是......嗯......一个链接，当用户单击链接时，我如何发送带有请求的令牌，以便我执行必要的检查服务器？

出于安全原因，我无法将令牌保存在其他任何地方（是的，我知道这也不完全安全，我进行了比较并认为它是我系统的最佳选择），我也无法编写 API 请求出于明显的原因，对于每个链接！ （以及其他原因，包括我在前端使用香草 JS！太糟糕了！）

如果您有兴趣，我的后端在 node 中并表示，但这不是问题所在......

【问题讨论】：

重要！您应该编写代码并附上解释，否则将很难回答您的问题。

当用户输入正确的凭据时，您需要将令牌存储到客户端（本地存储）并将您的用户重定向到受保护的路由。当用户重定向到受保护的路由时，您需要将带有令牌（存储在本地存储中）的发布请求发送到您的 Api。如果令牌无效，Api 将验证该令牌，然后您需要将用户重定向到主页，否则您可以将用户保留在当前页面上。

希望对您有所帮助！

@GulshanAggarwal 你是完全正确的，但我认为就我的情况而言，也许不是。因为答案只是一个“如何做”的问题。 “当用户单击网站中另一个页面的链接时，如何将数据从本地存储发送到服务器？”看？不幸的是没有代码......

@GulshanAggarwal 感谢您的帮助。但是我知道这种方法，但是为每个链接编写一个 api 请求有点难看（我在问题帖子中说过），所以我问是否有更好/更整洁的方法......

【参考方案1】：

将令牌存储在 cookie 中：

document.cookie = 'token=<token_here>'

更安全！

Learn more

要将令牌传递给后端，请使用标头（“授权”标头）或 cookie。两者都有效。

要使用链接执行此操作，您必须阻止默认链接行为并使用“授权”标头或 cookie 对后端进行 ajax 调用。

【讨论】：

如果您为 cookie 标记了适当的标志...

@SoumenMukherjee，没关系。您可以在后端获取任何内容。