Javascript 在何处存储身份验证令牌（前端）以及如何将其放入多个端点的http头中？

我想为移动和webapp编写auth后端，所以我决定使用DRF（Django Rest框架）令牌身份验证

我基本上是通过DRF文档了解后端的，但关于前端实现，它只是说“在每个对API的http请求的头中包含令牌。”

---

所以我的问题是

在AJAX调用中检索令牌时，应将其存储在何处，以便在浏览器刷新时它不会消失？
（显然我没有使用cookie，因为手机对cookie的使用有限制）

如何在多个API端点的http头中插入身份验证令牌？

在Stackoverflow的帮助下，我了解了如何在单个http头中插入auth令牌

$.ajax({
  url: "https://www.something.com/random",
  type: 'get',
  headers: {
    token: "t&jdd9HJKHdss7hkjjkhdshgs",
  }
});

---

我想知道我是否必须为每个端点编写这段代码，或者是否有一种方法可以覆盖所有端点而不冗余？

您可以使用本地存储和拦截器在单个位置附加令牌。

---

在堆栈溢出方面也存在类似的问题

在浏览器中存储令牌的方法有三种：

LocalStorage-存储的数据没有过期日期，无法从后端访问

会话存储-在浏览器/选项卡打开之前存储数据，不能从后端访问

Cookie存储数据，过期时间可以单独设置，并随后续请求自动发送到服务器

详情如下：

因此，只有Cookie会自动为您提供，其余的都需要手动提供

您可以从本地存储和会话存储中进行选择，但如果希望用户下次打开页面时登录，我会选择本地存储

然后需要手动将其添加到每个API请求中，但您可以创建一个帮助器函数以使其更容易：

function apiRequest(type, url) {
  return $.ajax({
    url: url,
    type: type,
    headers: {
      token: localStorage.getItem("token"),
    }
  });
}

apiRequest("get","https://www.something.com/random").done(function(data) {
  console.log(data) 
})

---

有关本地存储的更多信息：

尝试将令牌存储在会话存储中：

sessionStorage.setItem（'token'，value）并使用以下命令检索它：
sessionStorage.getItem（'token'）本地存储呢？localStorage是否更适合于此？如果您希望在浏览器/窗口关闭后仍保留这些值，可以使用
localStorage