常用vue本地存储

---

一、为什么要用本地存储？

通过本地存储（Local Storage），web 应用程序能够在用户浏览器中对数据进行本地的存储。

在 HTML5 之前，应用程序数据只能存储在 cookie 中，包括每个服务器请求。本地存储则更安全，并且可在不影响网站性能的前提下将大量数据存储于本地。

与 cookie 不同，存储限制要大得多（至少5MB），并且信息不会被传输到服务器

二、常用的三种方法

1.cookie

2.localStorage（本地存储）

这个是一般常用的

// 存储
localStorage.setItem("lastname", "Gates");
// 取回
localStorage.getItem("lastname");
//如果是对象的话可以使用JSON.stringify（）转换Json形式 
localStorage.setItem("lastname", JSON.stringify(Gates))

3.sessionStorage

和localStorage用法基本上一样
localStorage是永久存储，除非手动删除。
sessionStorage当会话结束（当前页面关闭的时候，自动销毁）

---

cookie、localStorage、sessionStorage区别

相同：在本地（浏览器端）存储数据

不同：

localStorage、sessionStorage
localStorage只要在相同的协议、相同的主机名、相同的端口下，就能读取/修改到同一份localStorage数据。

sessionStorage比localStorage更严苛一点，除了协议、主机名、端口外，还要求在同一窗口（也就是浏览器的标签页）下。

localStorage是永久存储，除非手动删除。

sessionStorage当会话结束（当前页面关闭的时候，自动销毁）

cookie的数据会在每一次发送http请求的时候，同时发送给服务器而localStorage、sessionStorage不会。