存储在本地存储中的数据丢失问题

Question

我有一个令牌存储在localStore中，我也有一个方法来验证令牌是否正确，正如您在这段代码中看到的：

let token = localStorage.getItem('token');
console.log(token);

if ( !token )
{
    return null;
}

const parts = token.split('.');

if ( parts.length !== 3 )
{
    throw new Error('error');
}
....

如果令牌未定义我将返回null，否则继续验证。

有两个问题我不能理解：

• 为什么我刷新页面时丢失了本地存储的令牌
• 为什么if（！令牌）返回false当令牌是未定义的时，第一个console.log返回未定义的，但我的方法继续const part=token.split ('.');。

Answer 1

本地存储只能使用字符串。

窗户。本地存储

使用localStorage存储的密钥和值始终采用UTF-16 DOMString格式，每个字符使用两个字节。与对象一样，整数键会自动转换为字符串。

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

因此，每个值都序列化为字符串。

localStorage.setItem('token', undefined);
let token = localStorage.getItem('token');
console.log(token);
console.log(typeof(token));

在控制台中打印：

undefined
string

结论：

1. 不要将null和未定义存储在本地存储中。
2. 验证本地存储中的值时，始终将其视为字符串值。

注意事项：

1. 默认情况下，验证应返回false。只有在成功的情况下，才会返回true