cookie、session、localStorage、sessionStorage区别

cookie、session

会话（Session）跟踪是Web程序中经常使用的技术，用来跟踪用户的整个会话。经常使用的会话跟踪技术是Cookie与Session。Cookie经过在客户端记录信息肯定用户身份，Session经过在服务器端记录信息肯定用户身份。

本章将系统地讲述Cookie与Session机制，并比较说明何时不能用Cookie，何时不能用Session。

 

cookie

1.1  Cookie机制

在程序中，会话跟踪是很重要的事情。理论上，一个用户的全部请求操做都应该属于同一个会话，而另外一个用户的全部请求操做则应该属于另外一个会话，两者不能混淆。例如，用户A在超市购买的任何商品都应该放在A的购物车内，不管是用户A什么时间购买的，这都是属于同一个会话的，不能放入用户B或用户C的购物车内，这不属于同一个会话。

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

Cookie就是这样的一种机制。它能够弥补HTTP协议无状态的不足。在Session出现以前，基本上全部的网站都采用Cookie来跟踪会话。

1.1.1  什么是Cookie

Cookie意为“甜饼”，是由W3C组织提出，最先由Netscape社区发展的一种机制。目前Cookie已经成为标准，全部的主流浏览器如IE、Netscape、Firefox、Opera等都支持Cookie。

因为HTTP是一种无状态的协议，服务器单从网络链接上无从知道客户身份。怎么办呢？就给客户端们颁发一个通行证吧，每人一个，不管谁访问都必须携带本身通行证。这样服务器就能从通行证上确认客户身份了。这就是Cookie的工做原理。

Cookie其实是一小段的文本信息。客户端请求服务器，若是服务器须要记录该用户状态，就使用response向客 户端浏览器颁发一个Cookie。客户端浏览器会把Cookie保存起来。当浏览器再请求该网站时，浏览器把请求的网址连同该Cookie一同提交给服务 器。服务器检查该Cookie，以此来辨认用户状态。服务器还能够根据须要修改Cookie的内容。

 

 

查看某个网站颁发的Cookie很简单。在浏览器地址栏输入javascript:alert (document. cookie)就能够了（须要有网才能查看）。JavaScript脚本会弹出一个对话框显示本网站颁发的全部Cookie的内容，如图1.1所示。

图1.1  Baidu网站颁发的Cookie

 

图1.1中弹出的对话框中显示的为Baidu网站的Cookie。其中第一行BAIDUID记录的就是笔者的身份helloweenvsfei，只是Baidu使用特殊的方法将Cookie信息加密了。

 

注意：Cookie功能须要浏览器的支持。

若是浏览器不支持Cookie（如大部分手机中的浏览器）或者把Cookie禁用了，Cookie功能就会失效。

不一样的浏览器采用不一样的方式保存Cookie。

IE浏览器会在“C:\Documents and Settings\你的用户名\Cookies”文件夹下以文本文件形式保存，一个文本文件保存一个Cookie。

 

session

1.2  Session机制

除了使用Cookie，Web应用程序中还常用Session来记录客户端状态。Session是服务器端使用的一种记录客户端状态的机制，使用上比Cookie简单一些，相应的也增长了服务器的存储压力。

1.2.1  什么是Session

Session是另外一种记录客户状态的机制，不一样的是Cookie保存在客户端浏览器中，而Session保存在服务器上。客户端浏览器访问服务器的时候，服务器把客户端信息以某种形式记录在服务器上。这就是Session。客户端浏览器再次访问时只须要从该Session中查找该客户的状态就能够了。

若是说Cookie机制是经过检查客户身上的“通行证”来肯定客户身份的话，那么Session机制就是经过检查服务器上的“客户明细表”来确认客户身份。Session至关于程序在服务器上创建的一份客户档案，客户来访的时候只须要查询客户档案表就能够了。

 

localStorage、sessionStorage

在HTML5中，新加入了一个localStorage特性，这个特性主要是用来做为本地存储来使用的，解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k)，localStorage中通常浏览器支持的是5M大小，这个在不一样的浏览器中localStorage会有所不一样。

localStorage的优点

一、localStorage拓展了cookie的4K限制

二、localStorage会能够将第一次请求的数据直接存储到本地，这个至关于一个5M大小的针对于前端页面的数据库，相比于cookie能够节约带宽，可是这个倒是只有在高版本的浏览器中才支持的

localStorage的局限

一、浏览器的大小不统一，而且在IE8以上的IE版本才支持localStorage这个属性

二、目前全部的浏览器中都会把localStorage的值类型限定为string类型，这个在对咱们平常比较常见的JSON对象类型须要一些转换

三、localStorage在浏览器的隐私模式下面是不可读取的

四、localStorage本质上是对字符串的读取，若是存储内容多的话会消耗内存空间，会致使页面变卡

五、localStorage不能被爬虫抓取到

localStorage与sessionStorage的惟一一点区别就是localStorage属于永久性存储，而sessionStorage属于当会话结束的时候，sessionStorage中的键值对会被清空

这里咱们以localStorage来分析