cookie
document.cookie = token; //将token保存在cookie中
var token =document.cookie.split(";")[0]; //从cookie中读取token
sessionStorage
//存储
sessionStorage.setItem("addTrafficInfo",
JSON.stringify(data));
//获取
let userInfo =
sessionStorage.userInfo;
this.userType=JSON.parse(userInfo).type;
--------------------------------------------------------------------------
2个接口:分别是localStorage和sessionStorage
4个函数:分别是setItem、getItem、removeItem和clear
localStorage:
特性:
域内安全、永久保存。即客户端或浏览器中来自同一域名的所有页面都可访问localStorage数据且数据除了删除否则永久保存,但客户端或浏览器之间的数据相互独立。
四个函数:
. localStorage.setItem 存储数据信息到本地
. localStorage.getItem 读取本地存储的信息
. localStorage.removeItem 删除本地存储的信息
. localStorage.clear
清空所以存储的信息
sessionStorage:
(1)特性: 会话控制、短期保存。会话概念与服务器端的session概念相似,短期保存指窗口或浏览器或客户端关闭后自动消除数据。
(2)四个函数:
. sessionStorage.setItem 存储数据信息到本地
. sessionStorage.getItem 读取本地存储的信息
. sessionStorage.removeItem 删除本地存储的信息
. sessionStorage.clear 清空所以存储的信息
四个函数的用法:
(1)localStorage.setItem(键名,键值)
在本地客户端存储一个字符串类型的数据,其中,第一个参数“键名”代表了该数据的标识符,而第二个参数“键值”为该数据本身。如: localStorage.setItem("coffeeType","mocha"); //存储键名为coffeeType和键值为mocha的数据到本地 localStorage.setItem("coffeePrice", "28");
//有了上一句做参考,这句意思你该理解了吧
(2)localStorage.getItem(键名)
读取已存储在本地的数据,通过键名作为参数读取出对应键名的数据。如:
var data =localStorage.getItem("coffeeType"); //读取对应键名为coffeeType的数据
(3)localStorage.removeItem(键名)
移除已存储在本地的数据,通过键名作为参数删除对应键名的数据。如: localStorage.removeItem("coffeeType");
//从本地存储中移除键名为coffeeType的数据
(4)localStorage.clear()
移除本地存储所有数据。如: localStorage.clear();
//保存着的"coffeePrice/28"键/值对也被移除了,所有本地数据拜拜
/**
* Vue的插件,用来获取和设置localStorage存储
**/
let local = {
save (key, value) {
localStorage.setItem(key, JSON.stringify(value))
},
fetch (key) {
return JSON.parse(localStorage.getItem(key)) || {}
}
}
export default {
install: function (vm) {
//把需求应用到的值挂载在原型上
vm.prototype.$local = local
}
}