cookie、session、SessionStorag和LocalStorage的概念讲解

1>cookie：

1.概念：

cookie机制其实就是在客户端保持状态的方案，cookie又叫会话跟踪机制。打开一次到关闭浏览器算是一次会话。cookie可以跟踪会话，弥补http无状态协议的不足。

cookie由键值对构成是由服务器创建，然后通过响应发送给客户端。客户端会保存cookie，并会标注出cookie的来源（哪个服务器的cookie）。当客户端向服务器发出请求时会把所有这个服务器cookie包含在请求中发送给服务器，这样服务器就可以识别客户端了。在js中cookie以字符串的形式保存在浏览器中。

2.http中cookie

1》请求头，客户端发送给服务器端；

格式：cookie:a=a;b=b;c=c。即多个cookie用分号离开；

2》响应头，服务器端发送给客户端

一个cookie对象一个set-cookie：

set-cookie:a=a

set-cookie:b=b

set-cookie:c=c

3》cookie的覆盖

如果服务器端发送重复的cookie那么会覆盖原有的cookie，例如客户端的第一个请求服务器端发送的cookie是：set-cookie:a=a；第二请求服务器端发送的是：set-cookie:a=aa，那么客户端只留下一个cookie，即：a=aa。

3.js中cookie设置

cookie的几种常见属性：name(名称)、value(值)、expires(过期时间)、path(路径)、domain(域)、secure(安全)，其中后四个是可选的。

document.cookie=’username=wangjunjie’。

1、名和值：名用来引用cookie，值是cookie的信息部分，这两部分是必选的。

设置cookie的名值：document.cookie=’username=wangjunjie’。

2、过期时间：如果cookie不设置expires，用户关闭浏览器后cookie过期，下次打开浏览器时该cookie不复存在。过期时间的格式是非常重要的，对于ie浏览器尤为重要，它应该与togmtstring()给出的格式相同。

3、路径：站点里有两个目录~/a和~/b，~/b中设置的cookie可以在它的目录及其子目录下访问，不能在~/a中访问，如果想在站点里的任何地方访问~/b中设置的cookie，则需要把path设置为’/'。

设置cookie的路径：document.cookie=’username=wangjunjie;path=/’;

4.域：默认情况下cookie仅用于设置它的域下面的页面，假设现在有两个站点a.blog.com和b.blog.com，在a.blog.com下设置的cookie不能在b.blog.com下访问，反之也是这样，如果想在两个站点下都访问这个cookie需要该domain值。

设置cookie的域：document.cookie=’username=wangjunjie;domain=blog.com’;

5、安全：cookie的最后一部分是一个boolen值，默认为false，总是发送cookie，不考虑安全性，如果设置为true，则cookie仅发送给尝试使用安全通道检索它的web服务器。

4.cookie代码

    //设置cookie
	function setcookie(name,value,days){
		var d = new date();
		d.settime(d.gettime() + (days*24*60*60*1000));
		var expires = 'expires=' +d.togmtstring();
		document.cookie=name+'='+value+';'+expires;

	}
	setcookie('shisha',18,1)
    //获取cookie
    function getcookie(cname){
    	var name = cname + '=';
    	var ca =document.cookie.split(';');
    	for(var i = 0;i
2>session
1.概念：
客户端浏览器访问服务器的时候，服务器把客户端信息以某种形式记录在服务器上。这就是session。客户端浏览器再次访问时只需要从该session中查找该客户的状态就可以了。如果说cookie机制是通过检查客户身上的“通行证”来确定客户身份的话，那么session机制就是通过检查服务器上的“客户明细表”来确认客户身份。session相当于程序在服务器上建立的一份客户档案，客户来访的时候只需要查询客户档案表就可以了。比如张三和李四分别访问该网站，在服务端会产生两个sessionid来区分该用户，而在客户端将对应的sessionid存放在cookie中，以便我们再次访问时得到我们所需的资源。
2.解决的问题：
session解决的问题和cookie一样，比如：我在www.a.com/login.php里面登陆了，我在www.a.com/index.php 也希望是登陆状态，但是这是2个不同的页面，也就是2个不同的http请求，这2个http请求是无状态的，也就是无关联的，所以无法单纯的在index.php中读取到它在login.php中已经登陆了。这是候就出现了cookie，cookie是把少量的信息存储在用户自己的电脑上，它在一个域名下是一个全局的，只要设置它的存储路径在域名www.a.com下 ，那么当用户用浏览器访问时，就可以从这个域名的任意页面读取cookie中的信息。所以就很好的解决了我在www.a.com/login.php页面登陆了，我也可以在www.a.com/index.php获取到这个登陆信息了。同时又不用反复去查询数据库。但是由于cookie 是存在用户端，而且它本身存储的尺寸大小也有限，最关键是用户可以是可见的，并可以随意的修改，很不安全。这时候session就出现了session 他解决了在一次会话中2次http的请求的关联，让它们产生联系，让2两个页面都能读取到找个这个全局的session信息。session信息存在于服务器端，所以也就很好的解决了安全问题。
3>cookie和session的区别
1、cookie数据存放在客户的浏览器上，session数据放在服务器上 

2、cookie不是很安全，别人可以分析存放在本地的cookie并进行cookie欺骗， 考虑到安全应当使用session 

3、session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能，考虑到减轻服务器性能方面，应当使用cookie
4、单个cookie在客户端的限制是3k，就是说一个站点在客户端存放的cookie不能3k
4>cookie、sessionstorag、localstorage
共同点：
cookie、sessionstorag、localstorage都是在浏览器端存储的数据，且为同源的。
区别:
1.传输：
cookie数据始终在同源的http请求中携带（即使不需要）。而sessionstorage和localstorage不会自动把数据发给服务器，仅在本地保存。
2.存储大小：
cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。sessionstorage和localstorage虽然也有存储大小的限制，但比cookie大得多，可以达到5m或更大。
3.保存时间：
数据有效期不同，sessionstorage：仅在当前浏览器窗口关闭前有效；localstorage：始终有效，窗口或浏览器关闭也一直保存，除非主动删除数据，否则数据是永远不会过期的。因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。如果不设置默认浏览器关闭失效。
4.作用域不同：
不同页面或标签页间无法共享sessionstorage的信息，sessionstorage为每一个给定的源（given origin）维持一个独立的存储区域，该存储区域在页面会话期间可用（即只要浏览器处于打开状态，包括页面重新加载和恢复）。localstorage在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。
5>localstorage和sessionstorage使用时使用相同的api
通过getitem或直接使用localstorage["key"]获取到的信息均为实际存储的副本
localstorage.setitem("name","value");//以“name”为名称存储一个值“value”
localstorage.getitem("name");//获取名称为“name”的值
localstorage.removeitem("name");//删除名称为“name”的信息。
localstorage.clear();//清空localstorage中所有信息
枚举localstorage的方法：
for(var i=0;i
 
;>