本地存储和会话存储

本地存储的数据会在浏览器关闭后保留，而会话存储的数据会在页面会话结束时消失。

目录

• 一，什么是本地存储

• 一、pandas是什么？
• 二、使用步骤
  • 1.引入库
  • 2.读入数据
• 总结

---

一 什么是本地存储（LocalStorage）

本地存储（LocalStorage）是浏览器提供的一种机制，允许Web应用程序在用户的浏览器中存储数据。这些数据以键值对（key-value pairs）的形式存储，并且可以在浏览器会话之间保持持久性。本地存储是基于域名的，这意味着数据将与特定域名相关联。

本地存储的特点 ：

持久性： 存储在LocalStorage中的数据在浏览器关闭后仍然保留，直到被明确删除。

容量限制： 浏览器为每个域名提供了一定的LocalStorage存储容量，通常为5-10MB。超出容量限制时，需要谨慎管理存储数据。

同源策略： 受同源策略的限制，LocalStorage只能访问与当前页面相同协议、域名和端口的数据。这意味着不同子域名之间的LocalStorage数据是隔离的。

只能存储字符串： LocalStorage只能存储字符串类型的数据。如果要存储其他数据类型（如对象...），需要进行序列化和反序列化。

二，使用本地存储

1.存储数据：

使用localStorage.setItem(key, value)方法来存储数据，其中key是您要存储的数据的键，value是对应的值。

注意：LocalStorage只能存储字符串类型的值，如果要存储对象或数组，需要先将其序列化为字符串。

 

2.检索数据 

使用localStorage.getItem(key)方法来检索存储在LocalStorage中的数据。如果之前存储的是对象或数组，需要使用JSON.parse()来解析数据。

3.更新数据 

要更新LocalStorage中的数据，首先检索数据，然后对其进行修改，最后使用localStorage.setItem()重新存储。

4.删除数据 

使用localStorage.removeItem(key)方法来删除LocalStorage中的特定数据。

5.清空本地存储

使用localStorage.clear()方法来清空整个LocalStorage，删除所有存储的数据。

三，会话存储获取数组

localStorage有个限制，会将数组转为字符串

 

JSON.stringify：将数组设置为本地存储中的值。

JSON.parse：从本地存储中获取数组。

会话存储

只需要把localStorage改成sessionStorage

本地存储和会话存储的区别

关闭浏览器再打开，就会发现会话存储空间的数据已经消失了，但是本地存储空间的数据还是存在的。

扩展

localStorage也可以手动设置失效时间,大概思路是存储的值加一个时间戳，下次取值时验证时间戳,localStorage只能存储字符，存入时将对象转为json字符串,读取时也要解析.

---

总结

相同点：都保存在浏览器端，可以下图位置查看储存的信息

不同点：

①传递方式不同

cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递。

sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。

②数据大小不同

cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。
存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。