JavaScript 笔记(19)- 客户端存储

原创 乘风逐月 随笔 JavaScript 121阅读 2018-06-21 10:00:18 举报

一、cookie

cookie 用于客户端存储会话信息,要求服务器对任意 http 请求发送 Set-Cookie HTTP 头作为响应的一部分,其中包含会话信息,以 name=value 的形式。名值在传送时必须是 URL 编码的,浏览器会存储会话信息,在之后通过为每个请求添加 Cookie HTTP 头将信息发送回服务器,可用以验证客户来自于发送的那个请求。

1.cookie 的构成

(1)名称
一个唯一确定 cookie 的名称,名称不区分大小写,需要经过 URL 编码
(2)值
存储在 cookie 中的字符串值,需要经过 URL 编码
(3)域
cookie 对哪个域有效,所有向该域发送的请求中都包含这个 cookie 的信息。这个值可以包含子域
(4)路径
对于指定域中的那个路径,才会向服务器发送 cookie,其他页面即使是同域的也不会发送 cookie 信息
(5)失效时间
表示何时删除 cookie 的时间戳(即何时停止向服务器发送这个 cookie)。默认情况浏览器会话结束就会删除所有 cookie 。可以自定义删除时间,格式是GMT格式日期(如:Wdy,DD-Mon-YYYY HH:MM:SS)。如果设置的是过去的时间,则cookie会被立刻删除。
(6)安全标志(secure)
指定后,cookie 只有在使用 SSL 连接时才发送到服务器。

每段信息都作为 Set-Cookie 头的一部分,使用分号加空格分隔,例如

该头信息指定了名为 name 的 cookie,会在 2018年1月22日 7:10:24 失效,对 wrox.com 的子域都有效。因为设置了 secure 标志,只能通过 SSL 连接才能传输。
注: 域,路径,失效时间,和 secure 标志都是服务器给浏览器的指示,以指定何时应该发送 cookie。这些参数并不会发送给服务器,只有名值对才会被发送。

2.限制

(1)不同域限制
cookie 在性质上是绑定在特定域名下,当设定了一个 cookie ,再给创建它的域名发送请求时都会包含这个 cookie 。这个限制确保了存储在 cookie 中的信息只能让批准的接受者访问,而无法被其他域访问。
(2)cookie 个数限制
每个域的cookie总数是有限的,不同浏览器不同。当超过单个域名限制的总数后,再设置 cookie 就会清楚以前设置的 cookie ,腾出新空间给新设置的 cookie。
(3)cookie 大小的限制
大多数浏览器对 cookie 大小限制在大约 4096B(加减1)的长度限制,超过限制的 cookie 会被丢弃。

3.JavaScript 中的 cookie

(1)取值
document.cookie 属性返回当前页面可用的所有 cookie 的字符串,以分号分隔的名值对。所有名值都经过 URL 编码,需用 decodeURIComponent() 解码。
(2)设置值
document.cookie 属性可用设置为一个新的 cookie 字符串,新 cookie 会添加到现有 cookie 集合中,不会覆盖 cookie,除非有同名 cookie。

二、sessionStorage/localStorage

1.共有方法属性

a. clear(): 删除所有值
b. getItem(key): 根据指定key获取值
c. setItem(key,value): 为指定的key设置值
d. removeItem(key): 删除指定key的名值对
e. key(index): 获取index位置处的名值对的key名称
f. length: 存储的名值对的个数

2.sessionStorage对象

sessionStorage对象存储特定于某个会话的数据,即数据只保存到浏览器关闭。存储在sessionStorage对象中的数据可以跨越页面刷新而存在,但对多页面应用有限制。

3.localStorage对象

localStorage对象可以在客户端持久保存数据,要访问同一个 localStorage 对象,页面必须来自同一个域名(子域名无效),使用同一种协议,在同一个端口上。localStorage 对象中的数据保存到通过 JavaScript 删除或者是用户清除浏览器缓存为止。

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复