基本概念
cookie
cookie非常小,它的大小限制为4kb左右.它的主要用途有保存登录信息,比如登录某个网站时可以看到"记住密码",通常就是通过在 Cookie 中存入一段辨别用户身份的数据来实现
localStorage 本地存储
localStorage 是 HTML5 标准中新加入的技术,localStorage被大多数浏览器所支持
sessionStorage 临时存储
sessionStorage 与 localStorage 的接口类似,当页面关闭后,sessionStorage中的数据会被清空
三者异同
cookie:单个cookie保存的数据不能超过4kb;session大小没有限制。
缺点:cookie:(1)大小受限
(2)用户可以操作(禁用)cookie,使功能受限
(3)安全性较低
(4)有些状态不可能保存在客户端。
(5)每次访问都要传送cookie给服务器,浪费带宽。
(6)cookie数据有路径(path)的概念,可以限制cookie只属于某个路径下。
WebStorage提供了一些方法,数据操作比cookie方便; sessionStorage localStorage
setItem (key, value) —— 保存数据,以键值对的方式储存信息。
getItem (key) —— 获取数据,将键值传入,即可获取到对应的value值。
removeItem (key) —— 删除单个数据,根据键值移除对应的信息。
clear () —— 删除所有的数据
key (index) —— 获取某个索引的key
cookie设置语法:
document.cookie = "cookieName=mader; expires=Fri, 31 Dec 2017 15:59:59 GMT; path=/mydir; domain=cnblogs.com; max-age=3600; secure=true";
注意:cookie是http/https协议下的技术,不支持本地file文件对cookie操作
- cookieName=mader :name=value,cookie的名称和值
- expires=Fri, 31 Dec 2017
15:59:59 GMT: expires,cookie过期的日期,如果没有定义,cookie会在对话结束时过期。日期格式为 new Date().toUTCString() - path=/mydir: path=path (例如 ‘/’, ‘/mydir’)
如果没有定义,默认为当前文档位置的路径。 - domain=cnblogs.com: 指定域(例如 ‘example.com’,
‘.example.com’ (包括所有子域名), ‘subdomain.example.com’)
如果没有定义,默认为当前文档位置的路径的域名部分。 - max-age=3600: 文档被查看后cookie过期时间,单位为秒
- secure=true: cookie只会被https传输 ,即加密的https链接传输