sessionStorage 、localStorage 和 cookie 之间的区别详解

sessionstorage 、localstorage 和 cookie 之间的区别

共同点：都是保存在端，且同源的。

区别：

1:cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递。

而sessionstorage和localstorage不会自动把数据发给服务器，仅在本地保存。

cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。

2:存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。

sessionstorage和localstorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5m或更大。

3:数据有效期不同，sessionstorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localstorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。

4:作用域不同，sessionstorage不在不同的浏览器窗口敏感词享，即使是同一个页面；localstorage在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。

5:webstorage支持事件通知机制，可以将数据更新的通知发送给监听者。

6:webstorage的 api 接口使用更方便。 get和post的区别： 　　

1.get请求的数据会附在url之后（就是把数据放置在http协议头中），以分割url和传输数据，参数之间以&相连，

如：login.actionname=hyddd&password=idontknow&verify=%e4%bd%a0%e5%a5%bd。如果数据是英文字母/数字，原样发送，如果是空格，转换为+，如果是中文/其他字符，则直接把字符串用base64，得出如：%e4%bd%a0%e5%a5%bd，其中％xx中的xx为该符号以16进制表示的ascii。 　　

post把提交的数据则放置在是http包的包体中。

2."get方式提交的数据最多只能是1024字节，理论上post没有限制，可传较大量的数据，iis4中最大为80kb，iis5中为100kb"？？！

3.在asp中，服务端获取get请求参数用request.querystring，获取post请求参数用request.form。在jsp中，用request.getparameter(\"xxxx\")来获取，虽然中也有request.getquerystring()方法，但使用起来比较麻烦，

比如：传一个test.jspname=hyddd&password=hyddd，

用request.getquerystring()得到的是：name=hyddd&password=hyddd。在php中，可以用$_get和$_post分别获取get和post中的数据，而$_request则可以获取get和post两种请求中的数据。

值得注意的是，jsp中使用request和php中使用$_request都会有隐患。

4.post的安全性要比get的安全性高。注意：这里所说的安全性和上面get提到的“安全”不是同个概念。上面“安全”的含义仅仅是不作数据修改，而这里安全的含义是真正的security的含义，比如：通过get提交数据，用户名和密码将明文出现在url上，因为(1)登录页面有可能被浏览器缓存

(2)其他人查看浏览器的历史纪录，那么别人就可以拿到你的账号和密码了，除此之外，使用get提交数据还可能会造成cross-site request forgery攻击。

cookie机制：正统的cookie分发是通过扩展http协议来实现的，服务器通过在http的响应头中加上一行特殊的指示以提示浏览器按照指示生成相应的cookie。

然而纯粹的客户端脚本如javascript或者vbscript也可以生成cookie。

而cookie的使用是由浏览器按照一定的原则在后台自动发送给服务器的。

浏览器检查所有存储的cookie，如果某个cookie所声明的作用范围大于等于将要请求的资源所在的位置，则把该cookie附在请求资源的http请求头上发送给服务器。

因为js运行在浏览器中，是单线程的，每个window一个js线程，既然是单线程的，在某个特定的时刻只有特定的代码能够被执行，并阻塞其它的代码。

而浏览器是事件驱动的（event driven），浏览器中很多行为是异步（asynchronized）的，会创建事件并放入执行队列中。

javascript引擎是单线程处理它的任务队列，你可以理解成就是普通函数和回调函数构成的队列。当异步事件发生时，如mouse click, a timer firing, or an xmlhttprequest completing（鼠标点击事件发生、定时器触发事件发生、xmlhttprequest完成回调触发等），将他们放入执行队列，等待当前代码执行完成。

html5 提供了两种在客户端存储数据的新方法： localstorage - 没有时间限制的数据存储

sessionstorage - 针对一个 session 的数据存储 之前，这些都是由 cookie 完成的。

但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。 localstorage和sessionstorage都具有相同的操作方法，例如setitem()、getitem()和removeitem()等 localstorage和sessionstorage的方法： setitem存储value 用途：将value存储到key字段 用法：.setitem( key, value)