从本地存储 Angular 8 获取对象答案

【问题标题】：Get object from Local Storage Angular 8从本地存储 Angular 8 获取对象
【发布时间】：2021-03-01 10:31:32
【问题描述】：

我有一个本地存储，它正在存储一些数据。我正在尝试使用localStorage.getItem('id'); 获取组件中的数据，但它是未定义的。问题是，localStorage 以一种奇怪的格式存储id。它像abcabcabc.id 一样存储现在localStorage 中有多个这样的参数，并且对于每个登录的用户，字符串abcabcabc 都会发生变化。我怎样才能仍然获得id 值。我可以比较字符串或其他东西来获取值吗？就像它包含字符串.id 一样只读取那个值？如果是，您能解释一下如何实现吗？

本地存储：

abcabcabc.username.id = sdfsdfsdfs
abcabcabc.username.refreshToken = sdfsdfs
abcabcabc.username.accessToken = ertsdffdg

【问题讨论】：

在没有其他参数的情况下保存您的 id。 localStorage.setItem('YourIdVaribale');
问题是，我使用的是 AWS Cognito，它仅以特定格式发送它...例如：abcabcabc.username.id, abcabcabc.username.name 等。没有办法只获得id。我怎样才能在打字稿代码中实现这一点？
我正在寻找类似if string.includes(id) return它的东西
你没有办法获取组件中的用户名吗？（也许使用存储当前用户数据的服务？）这样，您可以访问 {username}.id
你完全可以做到这一点string.includes(id)return string.substring(0,9)。 0 和 9 用于 abcabcabc

标签： javascript angular typescript local-storage angular8

【解决方案1】：

localStorage 将数据设置为键值对的映射，因此：

var id = {key:"id", value:"sdfsdfsdfs"}
//JSON.stringify converts the JavaScript object id into a string 
localStorage.setItem('id', JSON.stringify(id));

现在您通过以下方式获取数据：

var getTheId = localStorage.getItem('id');
//you can use JSON.parse() if you need to print it
console.log('getTheId: ', JSON.parse(getTheId));

这是您通常的做法，但由于我不知道您是如何设置数据的，您可以通过以下方式获取数据：

var x = localStorage.getItem(id);//normally getting your id
//parse it
var st = JSON.parse(x);
var ids = [];
while(st.includes(id)){
//this is to only get the abcabacabc
var newId = st.substring(0,9);
ids.push(newId);
}
console.log(ids);

【讨论】：

【解决方案2】：

由于您不知道存储在 localStorage 中的确切密钥，因此请获取所有这些密钥，然后对其进行迭代。接下来，匹配您知道的部分键，即 id，如下图所示：

// fetch all key-value pairs from local storage
const localStorageKeys = { ...localStorage };

// iterate over them
for (const index in localStorageKeys) {

  // see if key contains id
  if (index.includes('id')) {

    // fetch value for corresponding key 
    console.log(localStorageKeys[index]);

  }
}

【讨论】：

这是完美的@Nicholas K。谢谢
你能不能也看看这个：stackoverflow.com/questions/64889510/…它是我的一个朋友发的。谢谢
不客气。不幸的是，这个问题太宽泛了。如果可以对其进行编辑以缩小到特定问题，我将很高兴能对此有所了解。干杯！
再次感谢。对于第二个问题，我在上面添加了一些带有注释的代码。我正在尝试在tokenExpiration 中获取到期时间，并使用本地时间检查它是否更大，将用户注销。 httpinterceptor 能否在条件生效或我需要手动触发时自动检查？你能解释一下它是如何工作的吗？谢谢。
拦截（请求：HttpRequest，下一个：HttpHandler）：Observable> { this.token = JSON.parse(localStorage.getItem('tokenExpiration')); if (this.tokenExpired(this.token)) { Auth.signOut().then((res) => { this.authState === 'signedout'; this.router.navigate(['/']); } ); } else { return } } private tokenExpired(token: number) { const expiry = token; return (Math.floor((new Date).getTime() / 1000)) >= expiry; }