localStorage、sessionStorage、session 和 cookie 有什么区别? [英] What is the difference between localStorage, sessionStorage, session and cookies?

查看:36
本文介绍了localStorage、sessionStorage、session 和 cookie 有什么区别?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

localStorage、sessionStorage、session 和 cookie 在技术上的优缺点是什么,我什么时候应该使用其中一种?

What are the technical pros and cons of localStorage, sessionStorage, session and cookies, and when would I use one over the other?

推荐答案

这是一个范围极其广泛的问题,很多优点/缺点都与具体情况相关.

This is an extremely broad scope question, and a lot of the pros/cons will be contextual to the situation.

在所有情况下,这些存储机制都特定于单个计算机/设备上的单个浏览器.任何跨会话持续存储数据的要求都需要涉及您的应用服务器端 - 最有可能使用数据库,但也可能使用 XML 或文本/CSV 文件.

In all cases, these storage mechanisms will be specific to an individual browser on an individual computer/device. Any requirement to store data on an ongoing basis across sessions will need to involve your application server side - most likely using a database, but possibly XML or a text/CSV file.

localStorage、sessionStorage 和 cookie 都是客户端存储解决方案.会话数据保存在您直接控制的服务器上.

localStorage, sessionStorage, and cookies are all client storage solutions. Session data is held on the server where it remains under your direct control.

localStorage 和 sessionStorage 是相对较新的 API(意思是,并非所有旧版浏览器都支持它们)并且几乎相同(API 和功能),唯一的例外是持久性.sessionStorage(顾名思义)仅在浏览器会话期间可用(并在选项卡或窗口关闭时被删除) - 但是,它可以在页面重新加载后继续存在(来源 DOM 存储指南 - Mozilla 开发者网络).

localStorage and sessionStorage are relatively new APIs (meaning, not all legacy browsers will support them) and are near identical (both in APIs and capabilities) with the sole exception of persistence. sessionStorage (as the name suggests) is only available for the duration of the browser session (and is deleted when the tab or window is closed) - it does, however, survive page reloads (source DOM Storage guide - Mozilla Developer Network).

显然,如果您要存储的数据需要持续可用,那么 localStorage 比 sessionStorage 更可取——尽管您应该注意两者都可以由用户清除,因此您不应依赖任一中数据的持续存在案例.

Clearly, if the data you are storing needs to be available on an ongoing basis then localStorage is preferable to sessionStorage - although you should note both can be cleared by the user so you should not rely on the continuing existence of data in either case.

localStorage 和 sessionStorage 非常适合在页面之间保存客户端脚本中所需的非敏感数据(例如:首选项、游戏分数).存储在 localStorage 和 sessionStorage 中的数据可以很容易地从客户端/浏览器中读取或更改,因此不应依赖于在应用程序中存储敏感或与安全相关的数据.

localStorage and sessionStorage are perfect for persisting non-sensitive data needed within client scripts between pages (for example: preferences, scores in games). The data stored in localStorage and sessionStorage can easily be read or changed from within the client/browser so should not be relied upon for storage of sensitive or security-related data within applications.

这对于 cookie 也是如此,它们可以被用户轻易篡改,并且数据也可以以纯文本形式从它们中读取 - 因此,如果您想存储敏感数据,那么会话实际上是您唯一的选择.如果您没有使用 SSL,cookie 信息也可能在传输过程中被拦截,尤其是在打开的 wifi 上.

This is also true for cookies, these can be trivially tampered with by the user, and data can also be read from them in plain text - so if you are wanting to store sensitive data then the session is really your only option. If you are not using SSL, cookie information can also be intercepted in transit, especially on an open wifi.

从积极的方面来说,cookie 可以通过设置仅 HTTP 标志来防止跨站点脚本 (XSS)/脚本注入等安全风险,这意味着现代(支持)浏览器将阻止访问 cookie 和值来自 JavaScript(这也会阻止您自己的合法 JavaScript 访问它们).这对于身份验证 cookie 尤其重要,它用于存储包含登录用户详细信息的令牌 - 如果您拥有该 cookie 的副本,那么出于所有意图和目的,您成为该用户就 Web 应用程序而言,并具有与用户相同的数据和功能访问权限.

On the positive side cookies can have a degree of protection applied from security risks like Cross-Site Scripting (XSS)/Script injection by setting an HTTP only flag which means modern (supporting) browsers will prevent access to the cookies and values from JavaScript (this will also prevent your own, legitimate, JavaScript from accessing them). This is especially important with authentication cookies, which are used to store a token containing details of the user who is logged on - if you have a copy of that cookie then for all intents and purposes you become that user as far as the web application is concerned, and have the same access to data and functionality the user has.

由于 cookie 用于身份验证目的和用户数据的持久性,所有对页面有效的 cookie 都会从浏览器发送到服务器,用于每个请求域 - 这包括原始页面请求、任何后续 Ajax 请求、所有图像、样式表、脚本和字体.因此,不应使用 cookie 来存储大量信息.浏览器还可能对可以存储在 cookie 中的信息大小施加限制.通常 cookie 用于存储用于身份验证、会话和广告跟踪的标识令牌.令牌本身通常不是人类可读的信息,而是链接到您的应用程序或数据库的加密标识符.

As cookies are used for authentication purposes and persistence of user data, all cookies valid for a page are sent from the browser to the server for every request to the same domain - this includes the original page request, any subsequent Ajax requests, all images, stylesheets, scripts, and fonts. For this reason, cookies should not be used to store large amounts of information. The browser may also impose limits on the size of information that can be stored in cookies. Typically cookies are used to store identifying tokens for authentication, session, and advertising tracking. The tokens are typically not human readable information in and of themselves, but encrypted identifiers linked to your application or database.

就能力而言,cookies、sessionStorage和localStorage只允许你存储字符串——设置时可以隐式转换原始值(这些需要在读取后转换回使用它们的类型)但不能对象或数组(可以使用 API 对它们进行 JSON 序列化以存储它们).会话存储通常允许您存储服务器端语言/框架支持的任何原语或对象.

In terms of capabilities, cookies, sessionStorage, and localStorage only allow you to store strings - it is possible to implicitly convert primitive values when setting (these will need to be converted back to use them as their type after reading) but not Objects or Arrays (it is possible to JSON serialise them to store them using the APIs). Session storage will generally allow you to store any primitives or objects supported by your Server Side language/framework.

由于 HTTP 是一种无状态协议 - 网络应用程序无法在返回网站时通过之前的访问来识别用户 - 会话数据通常依赖于 cookie 令牌来识别用户以进行重复访问(尽管很少有 URL 参数可能用于相同的目的).数据通常会有一个滑动的到期时间(每次用户访问时更新),并且取决于您的服务器/框架数据将存储在进程中(意味着如果 Web 服务器崩溃或重新启动,数据将丢失)或外部存储状态服务器或数据库.这在使用网络农场(一个给定网站的多个服务器)时也是必要的.

As HTTP is a stateless protocol - web applications have no way of identifying a user from previous visits on returning to the web site - session data usually relies on a cookie token to identify the user for repeat visits (although rarely URL parameters may be used for the same purpose). Data will usually have a sliding expiry time (renewed each time the user visits), and depending on your server/framework data will either be stored in-process (meaning data will be lost if the web server crashes or is restarted) or externally in a state server or database. This is also necessary when using a web-farm (more than one server for a given website).

由于会话数据完全由您的应用程序(服务器端)控制,因此它是任何本质上敏感或安全的最佳位置.

As session data is completely controlled by your application (server side) it is the best place for anything sensitive or secure in nature.

服务器端数据的明显缺点是可扩展性 - 在会话期间每个用户都需要服务器资源,并且客户端需要的任何数据都必须随每个请求一起发送.由于服务器无法知道用户是否导航到另一个站点或关闭了浏览器,因此会话数据必须在给定时间后过期,以避免所有服务器资源被放弃的会话占用.因此,在使用会话数据时,您应该注意数据可能已过期和丢失,尤其是在表单较长的页面上.如果用户删除他们的 cookie 或切换浏览器/设备,它也会丢失.

The obvious disadvantage of server-side data is scalability - server resources are required for each user for the duration of the session, and that any data needed client side must be sent with each request. As the server has no way of knowing if a user navigates to another site or closes their browser, session data must expire after a given time to avoid all server resources being taken up by abandoned sessions. When using session data you should, therefore, be aware of the possibility that data will have expired and been lost, especially on pages with long forms. It will also be lost if the user deletes their cookies or switches browsers/devices.

某些 Web 框架/开发人员使用隐藏的 HTML 输入将数据从表单的一页保存到另一页,以避免会话过期.

Some web frameworks/developers use hidden HTML inputs to persist data from one page of a form to another to avoid session expiration.

localStorage、sessionStorage 和 cookie 都受同源"规则的约束,这意味着浏览器应阻止访问除设置信息以开始的域之外的数据.

localStorage, sessionStorage, and cookies are all subject to "same-origin" rules which means browsers should prevent access to the data except the domain that set the information to start with.

有关客户端存储技术的进一步阅读,请参阅深入了解 Html 5.

For further reading on client storage technologies see Dive Into Html 5.

这篇关于localStorage、sessionStorage、session 和 cookie 有什么区别?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆