sessionstorage cookie localstorage 区别

东离与糖宝 · 2024-12-11 14:18:35 发布

发现宝藏

前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。【宝藏入口】。

sessionStorage、cookie 和 localStorage 都是 Web 浏览器提供的用于存储数据的技术。它们各自有不同的特性、用途和存储方式。下面是它们之间的主要区别：

sessionStorage:
- 存储在浏览器的会话中，只在当前浏览器标签页或窗口中有效。
- 数据会随着浏览器标签页或窗口的关闭而被清除。
- 每个标签页都有独立的 sessionStorage，不同标签页之间的数据不会共享。
- 数据的生命周期仅限于页面会话。
localStorage:
- 存储在浏览器中，并且没有过期时间限制，直到用户主动清除。
- 数据在浏览器关闭后仍然存在，即使重新打开浏览器，数据仍然可以访问。
- 不同标签页或窗口之间共享 localStorage 数据。
cookie:
- 存储在浏览器中，但通常用于存储小量的数据（每个 cookie 大约只有 4KB）。
- 可以设置过期时间，默认情况下，cookie 会在会话结束时（浏览器关闭）被删除，除非设置了过期时间。
- cookie 数据会随着每次请求（包括页面加载和 Ajax 请求）发送到服务器。
- 与 localStorage 和 sessionStorage 不同，cookie 的数据是可以被服务器读取的，适合存储一些用于服务器验证的信息（例如会话标识符）。

sessionStorage 和 localStorage:
- 它们的容量相对较大（一般来说每个存储空间为 5MB 左右，取决于浏览器）。
cookie:
- 存储容量较小（每个 cookie 大约为 4KB）。

sessionStorage 和 localStorage:
- 这些存储空间的数据仅在客户端访问，浏览器不自动将这些数据发送到服务器。
- 它们适合存储浏览器端数据，不会影响到网络请求。
cookie:
- 数据会随着每个 HTTP 请求发送到服务器（无论是页面请求、AJAX 请求还是 API 请求）。
- 由于它在每个请求中都会携带，因此会对性能产生一定影响，尤其是当 cookie 数据量很大时。

sessionStorage:
- 数据仅在同一个标签页内有效，不同标签页之间的 sessionStorage 数据是隔离的。
- 同一个标签页内不同页面之间可以共享 sessionStorage 数据。
localStorage:
- 数据在同一浏览器的同一域名下的所有页面和标签页中共享。
- 不同的域名或子域名之间的 localStorage 数据是隔离的。
cookie:
- 可以为特定的域名和路径设置，跨页面和跨会话都能使用。可以设置不同的域名、路径和有效期，以控制它的有效范围。

sessionStorage 和 localStorage:
- 这些数据仅在浏览器端存储，无法直接被服务器读取。
- 如果存在 XSS（跨站脚本攻击）漏洞，攻击者可以通过脚本读取这些数据。
cookie:
- cookie 数据会随每个请求发送到服务器，可能暴露在网络传输过程中（如果没有加密）。
- 可以通过 HttpOnly 标志设置 cookie 不能通过 JavaScript 访问，增强安全性。
- 可以通过 Secure 标志仅在 HTTPS 连接中发送，防止中间人攻击。