1、
随着HTML5规范的普及,我们不再用cookie来实现记住密码,通常会用的LocalStorage 及本地缓存。
对于Cookie来说它只有一个document.cookie这一个API可以使用,不管是读取Cookie还是存储Cookie你都只能使用它
然而LocalStorage,你存储的时候有localStorage.setItem(),你读取的时候有localStorage.getItem(),你想要删除的时候有localStorage.removeItem().此外在存储时,它们事以键值对的形式存储的.所以更易于使用.并且localStorge的储存空间大,有5M,并且是永久储存,除非你主动删除。
2、今天刚好在移动端的Vue项目中使用到了LocalStorage去记住用户的登录信息。
只是一个例子,并不是很完整,在使用axios请求验证登录信息时用到:
loginBtnClick() {
// 判断当前是否校验通过
if (this.erros.any()) {
console.log("有错误");
return;
}
console.log("没有错误");
// 发送ajax请求 axios
// 使用MintUI
Indicator.open("正在登陆.......");
// setTimeout(() => {
// Indicator.close();
// }, 2000);
axios.post('/login',{
CNO: this.CNO,
PNO: this.PNO,
Password: this.Password
}).then(res => {
if (res.data.code == 1) {
// 登陆成功 记住用户密码
localStorage.setItem("Login_data", JSON.stringfy({
remenber: this.remenber,
autologin: this.autologin,
PNO: this.remenber ? this.PNO : "",
CNO: this.remenber ? this.PNO : "",
Password: this.remenber ? this.Password : "",
}));
this.$router.push("/home");
} else {
}
Indicator.close();
})
.catch(e => {
Toast({
message: "",
})
Indicator.close();
})
}
3、在使用时特意去关注了一下本地存储的安全性,证明这种存储不是安全的。
节选----从远程攻击来看localStorage存储的数据容易被XSS攻击获取,所以不宜把身份验证信息或敏感信息用localStorage存储。而从本地攻击角度来说,从localStorage自身的存储方式和存储时效来看也不宜存储敏感信息。
五大浏览器现在都已经支持以localStorage方式进行存储,其中Chrome,Opera,Safari这三款浏览器中都有了查看本地存储的功能模块。
————————————————