前端数据存储

本文详细介绍了Web存储机制,包括Cookie存储和Web Storage,解释了它们的用途、限制和构成。着重对比了两者之间的区别,提供了浏览器兼容性和最佳实践建议。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一、Cookie存储

(1)HTTP Cookie 通常直接叫做cookie最初在客户端用于存储会话信息的 该标准要求服务器 对任意HTTP请求发送Set-Cookie HTTP头作为响应的一部分,其中包含会话信息。
这个HTTP响应设置以name为名称,以value为值的一个cookie名称和值在传送时都必须是URL编码的。
(2)限制:浏览器对每个域中cookie的总数是有限制的。不过浏览器之间各不相同。
IE6,以及更低版本每个域名最多20个cookie.
IE7和之后版本每个域名最多50个。
Firefox限制每个域名最多50个
Opera限制每个域名最多30个cookie
Safari和Chrome对于每个域的cookie数量限制没有硬性规定。
浏览器中对cookie的尺寸也有限制,大多数浏览器都有大约4096B(加减1)的长度限制
为了最佳的浏览器兼容性,最好将整个cookie大小限制在4095B内;。
(3)cookie的构成
名称(不区分大小写)、值、域、路径(对于指定域中的那个路径,应该向服务器发送cookie)、失效时间(表示cookie应该被何时删除的时间戳)、安全标志。

二、web存储机制


1、Web Storage的目的是为了克服由Cookie带来的一些限制。当数据被严格控制在客户端上时,无需持续将数据发送到服务器端,Web Storage 的两个主要目标是:
  提供一种cookie之外存储会话数据途径。
  提供一种存储大量可以跨会话存在的数据的机制。
  Storage 类型 提供最大的存储空间(因浏览器而异)来从存储名值对
 Storage对象有如下方法:
  (1)clear();删除所有值firefox中没有实现。
  (2)getItem(name),根据name获得对应的值,
  (3) key(index) 获取index处位置的名字
  (4)removeItem(name):删除由name指定的名值对。
  (5)setItem(name,value):为指定的name设置一个对应的值。
   二、sessionStorage 对象
   该对象存储特定于某个会话的数据。也就是说该数据只保持到浏览器关闭。sessionStorage是storage的实例所以可以使用storage的方法。
   不同的浏览器写入数据的方式不同,Firefox和Webkit`实现了同步写入,而IE的实现则是异步写入。
三、localStorage对象。
  持久保存客户端数据,要访问同一个localStorage对象。页面必须来自同一个域名(子域名无效),使用同一种协议,在同一个端口上。这相当于globalStorage(location.host)由于localStorage是storage 的实例,所以可以像sessionStorage那样使用storage方法。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值