三种前端存储方式的异同

三种前端存储方式的异同如下：

1. localStorage和sessionStorage：
- 存储大小：localStorage一般是5M左右，而sessionStorage大小约为4kb左右，50条左右\[1\]\[3\]。
- 存储特点：localStorage和sessionStorage都是永久性存储，但localStorage的存储内容过多会消耗内存空间，导致页面变卡。localStorage不能被爬虫抓取到，而sessionStorage在隐私模式下是不可读取的\[1\]\[3\]。
- 存储方式：localStorage和sessionStorage都遵循同源策略，只支持string类型的存储。可以使用setItem方法存储数据，使用getItem方法读取数据，使用removeItem方法删除指定数据，使用clear方法清空所有存储数据\[1\]。

2. Cookie：
- 存储大小：Cookie的存储大小约为4kb左右，50条左右\[3\]。
- 存储特点：Cookie是会话级的存储，关闭窗口并不会删除，需要关闭整个浏览器才可以删除\[3\]。
- 存储方式：可以直接使用document.cookie来存取数据。可以设置expires来控制Cookie的有效时间，设置path来控制Cookie的使用路径，设置domain来控制可以访问该Cookie的域名\[3\]。

总结：
- localStorage和sessionStorage适合存储较大量的数据，而Cookie适合存储较小量的数据。
- localStorage和sessionStorage是永久性存储，而Cookie是会话级的存储。
- localStorage和sessionStorage遵循同源策略，而Cookie可以通过设置path和domain来控制访问范围。
- localStorage和sessionStorage的存储内容不会被爬虫抓取到，而Cookie可以通过设置expires来控制有效时间。
#### 引用[.reference_title]
- *1* *2* *3* [【前端存储】storage/cookie的异同](https://blog.csdn.net/weixin_43523913/article/details/107110651)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]