cookie和本地存储

cookie概念

1.会话跟踪：

一个用户的所有请求操作都应该属于同一个会话，而另一个用户的所有请求操作则应该属于另一个会话，二者不能混淆。例如，用户A在超市购买的任何商品都应该放在A的购物车内，不论是用户A什么时间购买的，这都是属于同一个会话的，不能放入用户B或用户C的购物车内，这不属于同一个会话。

2. 为什么有cookie

      而Web应用程序是使用HTTP协议传输数据的。HTTP协议是无状态的协议。一旦数据交换完毕，客户端与服务器端的连接就会关闭，再次交换数据需要建立新的连接。这就意味着服务器无法从连接上跟踪会话。即用户A购买了一件商品放入购物车内，当再次购买商品时服务器已经无法判断该购买行为是属于用户A的会话还是用户B的会话了。要跟踪该会话，必须引入一种机制。

3. 什么是cookie

cookie实际上是一小段的文本信息。浏览器提供的一种机制,可以由Javascript对其进行控制(设置、读取、删除)。客户端请求服务器，如果服务器需要记录该用户状态，就使用response向客 户端浏览器颁发一个cookie。客户端浏览器会把cookie保存起来。当浏览器再请求该网站时，浏览器把请求的网址连同该cookie一同提交给服务 器。服务器检查该cookie，以此来辨认用户状态。服务器还可以根据需要修改cookie的内容。

3. cookie原理

由于HTTP是一种无状态的协议，服务器单从网络连接上无从知道客户身份。怎么办呢？就给客户端们颁发一个通行证吧，每人一个，无论谁访问都必须携带自己通行证。这样服务器就能从通行证上确认客户身份了。客户端请求服务器，如果服务器需要记录该用户状态，就使用response向客 户端浏览器颁发一个cookie。客户端浏览器会把cookie保存起来。当浏览器再请求该网站时，浏览器把请求的网址连同该cookie一同提交给服务 器。服务器检查该cookie，以此来辨认用户状态。服务器还可以根据需要修改cookie的内容。

           

 4. cookie的机制

 客户端请求服务器，如果服务器需要记录该用户状态，就使用response向客 户端浏览器颁发一个cookie。客户端浏览器会把cookie保存起来。当浏览器再请求该网站时，浏览器把请求的网址连同该cookie一同提交给服务 器。服务器检查该cookie，以此来辨认用户状态。服务器还可以根据需要修改cookie的内容。

什么是cookie

cookie是存储于访问者计算机中的变量

cookie是浏览器提供的一种机制

可以由Javascript对其进行控制(设置、读取、删除)

cookie的特性

cookie可以实现跨页面全局变量

cookie可以跨越同域名下的多个网页，但不能跨越多个域名使用

同一个网站中所有页面共享一套cookie

可以设置有效期限

存储空间只有4KB左右

cookie优缺点

cookie机制将信息存储于浏览器，因此可以作为跨页面全局变量，这是它最大的一个优点

常用场合：（1）保存用户登录状态；（2）跟踪用户行为.等等

cookie的缺点

（1）cookie可能被禁用；

（2）cookie与浏览器相关，不能互相访问；

（3）cookie可能被用户删除；

（4）cookie安全性不够高；

（5）cookie存储空间很小(只有4KB左右)

用escape( )函数进行编码 unescape( )进行解码才能

expires=data 设置有效期

localStorage

1. HTML5 本地存储：
   • 大小最小5MB，可以申请更大的空间
   • 不会随HTTP请求发送给服务器
   • 非常容易操作
   • 移动端普及高
   • localStorage与sessionStorage两种

localStorage

1. localStorage为永久性保存数据，不会随着浏览器的关闭而消失，可以在同域名跨页访问。
2. 按域名进行存储，不会和其他域名冲突
3. 键值对存储：key/value

localStorage API

1. setItem(key , value)，保存或设置数据

   如果key已经存在，则覆盖key对应的value

   如果不存在则添加key与value

1. getItem(key);   获取key对应的value。

   如果key不存在则返回null

1. removeItem('key'):删除数据，通过key来删除相应的value
2. key(index);  获取指定下标位置的key
3. length 获取localStorage一共有多少条数据
4. clear(); 将同域名下的所有localStorage数据都清空
5. storage事件：当同源的localStorage或sessionStorage有更改以后，会触发这个事件。

sessionStorage

1. sessionStorage为临时性保存数据，当页面关闭就会消失。其他一切与localStorage一样
2. sessionStorage不能跨页面访问，也不会触发跨标签页的storage事件。它只局限在当前的标签页