localStorage, sessionStorage, session 和的技术优缺点是什么,cookies我什么时候会使用其中一个?
localStorage
sessionStorage
cookies
这是一个范围非常广泛的问题,许多优点/缺点将与情况相关。
在所有情况下,这些存储机制将特定于单个计算机/设备上的单个浏览器。跨会话持续存储数据的任何要求都需要涉及您的应用程序服务器端——最有可能使用数据库,但也可能使用 XML 或文本/CSV 文件。
localStorage、sessionStorage 和 cookie 都是客户端存储解决方案。会话数据保存在您直接控制的服务器上。
localStorage 和 sessionStorage 是相对较新的 API(也就是说,并非所有旧版浏览器都支持它们)并且几乎相同(在 API 和功能方面),唯一的例外是持久性。sessionStorage(顾名思义)仅在浏览器会话期间可用(并且在选项卡或窗口关闭时被删除) - 但是,它确实可以在页面重新加载后继续存在(源DOM 存储指南 - Mozilla 开发者网络)。
显然,如果您存储的数据需要持续可用,那么 localStorage 比 sessionStorage 更可取 - 尽管您应该注意两者都可以由用户清除,因此在任何一种情况下您都不应该依赖数据的持续存在。
localStorage 和 sessionStorage 非常适合在页面之间保存客户端脚本中所需的非敏感数据(例如:偏好、游戏分数)。存储在 localStorage 和 sessionStorage 中的数据可以很容易地从客户端/浏览器中读取或更改,因此不应依赖于在应用程序中存储敏感或与安全相关的数据。
对于 cookie 也是如此,这些可以被用户轻易篡改,并且数据也可以以纯文本的形式从它们中读取 - 所以如果您想要存储敏感数据,那么会话实际上是您唯一的选择。如果您不使用 SSL,cookie 信息也可能在传输过程中被截获,尤其是在开放的 wifi 上。
从积极的方面来说,cookie 可以通过设置仅 HTTP 标志来防止跨站点脚本 (XSS)/脚本注入等安全风险,这意味着现代(支持)浏览器将阻止从 JavaScript 访问 cookie 和值(这也将阻止您自己的合法 JavaScript 访问它们)。这对于身份验证 cookie 尤其重要,它用于存储包含登录用户详细信息的令牌 - 如果您有该 cookie 的副本,那么就所有意图和目的而言,您 将成为 该用户,只要 Web 应用程序是关注,并且对用户拥有的数据和功能具有相同的访问权限。
由于 cookie 用于身份验证和用户数据的持久性,因此对于同一域的 每个请求,* 所有 对页面有效的 cookie 都会从浏览器发送到服务器- 这包括原始页面请求、任何后续 Ajax 请求、所有图像、样式表、脚本和字体。因此,不应使用 cookie 来存储大量信息。浏览器还可能对可存储在 cookie 中的信息大小施加限制。通常,cookie 用于存储用于身份验证、会话和广告跟踪的标识令牌。令牌本身通常不是人类可读的信息,而是链接到您的应用程序或数据库的加密标识符。 *
就功能而言,cookie、sessionStorage 和 localStorage 只允许您存储字符串 - 可以在设置时隐式转换原始值(读取后需要将这些值转换回以用作它们的类型),但不能存储对象或数组(可以使用 API 对它们进行 JSON 序列化以存储它们)。会话存储通常允许您存储服务器端语言/框架支持的任何原语或对象。
由于 HTTP 是一种无状态协议 - Web 应用程序在返回网站时无法从以前的访问中识别用户 - 会话数据通常依赖 cookie 令牌来识别用户以进行重复访问(尽管很少使用 URL 参数相同的目的)。数据通常会有一个滑动到期时间(每次用户访问时都会更新),并且取决于您的服务器/框架,数据将要么存储在进程内(这意味着如果 Web 服务器崩溃或重新启动,数据将丢失)或外部存储在状态服务器或数据库。这在使用网络农场(给定网站的多个服务器)时也是必要的。
由于会话数据完全由您的应用程序(服务器端)控制,因此它是本质上敏感或安全的任何东西的最佳位置。
服务器端数据的明显缺点是可伸缩性 - 在会话期间每个用户都需要服务器资源,并且客户端所需的任何数据都必须随每个请求一起发送。由于服务器无法知道用户是否导航到另一个站点或关闭浏览器,会话数据必须在给定时间后过期,以避免所有服务器资源被废弃的会话占用。因此,在使用会话数据时,您应该注意数据过期和丢失的可能性,尤其是在表单较长的页面上。如果用户删除他们的 cookie 或切换浏览器/设备,它也会丢失。
一些 Web 框架/开发人员使用隐藏的 HTML 输入将数据从表单的一个页面保存到另一个页面,以避免会话过期。
localStorage、sessionStorage 和 cookie 都受“同源”规则的约束,这意味着浏览器应阻止访问数据,但设置信息开始的域除外。
有关客户端存储技术的进一步阅读,请参阅Dive Into Html 5。