localStorage.getItem('token') 行为奇怪答案

【问题标题】：localStorage.getItem('token') acts strangelocalStorage.getItem('token') 行为奇怪
【发布时间】：2020-05-02 08:20:37
【问题描述】：

我有这段代码应该返回有关已连接用户的详细信息。问题是当我发送请求时，令牌似乎不正确，并且从 localStorage 中删除了令牌值。

const tokenHeader = new HttpHeaders({ Authorization: 'Bearer ' + localStorage.getItem('token')});
return this.http.get(AppSettings.URL, { headers: tokenHeader });

问题是我的令牌是正确的，如果我对从 localStorage.getItem('token') 生成的值进行硬编码，它就可以正常工作。例如

const tokenHeader = new HttpHeaders({ Authorization: 'Bearer ' + 'the token value from localStorage.getItem('token')')});
return this.http.get(AppSettings.URL, { headers: tokenHeader });

有人知道为什么会这样吗？谢谢！

【问题讨论】：

如何以及何时将令牌保存到 localStorage？如果在发出第一个请求时令牌尚未保存会怎样？
还要注意localStorage只保存字符串
我在用户登录时保存了令牌值。 localStorage.setItem('token', res.token);保存在 localStorage 中的值是正确的，因为相同的值允许我从邮递员或代码中执行请求，如果硬编码我从读取它得到的内容（我打印了我得到的值并在标题中手动编写它和请求工作得很好）。
简单，console.log 发出请求时从 localStorage 获得的令牌。它可能还无法访问或其他一些同步问题。日志记录将帮助您了解
我这样做了，打印的令牌是正确的。这就是我不明白的，因为标头应该是正确的，因为 localStorage 返回一个字符串

标签： angular authorization bearer-token

【解决方案1】：

我建议你将它传递给单独的变量。例如：

let headers = {};
const token = localStorage.getItem('token');
if (token) {
  Object.assign(headers, {
    Authorization: `Bearer ${token}`
  })
}

【讨论】：