Cookie机制
Cookie原意是小甜饼,是服务器保存在浏览器的一小段文本信息,属于其中一种互联网存储机制。
2.1 Cookie特点
每个Cookie大小一般不超过4KB;
Cookie保存的信息包括Cookie名、Cookie值、到期时间、所属域名和生效路径;
浏览器每次向服务器发出请求,会在Http请求头上带上Cookie信息;
2.2 Cookie API
浏览器可以设置拒绝Cookie
window.navigator.cookieEnabled =false;
获取当前页面的所有Cookie
写入Cookie
document.cookie ='name=teren';//document.cookie一次只能写一个cookie,而且是写入而不是覆盖;
[疑问]为什么读取cookie是全部,而写入则是一个一个呢?这与浏览器和服务器之间的cookie通信格式相关。
浏览器向服务器发送cookie时,是将所有cookie一起发送;
GET/sample_page.htmlHTTP/1.1Host:www.example.orgCookie: cookie_name1=cookie_value1; cookie_name2=cookie_value2Accept: */*
服务器告诉浏览器需要存储cookie时,则是分行设定
HTTP/1.0200OKContent-type: text/html
Set-Cookie: cookie_name1=cookie_value1Set-Cookie: cookie_name2=cookie_value2; expires=Sun, 16 Jul 3567 06:23:41 GMT
删除cookie
删除cookie的简便方法就是设置expires = 0或者是过期时间,如expires = Thu,01-Jan-1970 00:00:01 GMT
cookie的属性
Set-Cookie: value[;expires = date][;domain = domain][;path = path][;secure][;HttpOnly]
value:规定cookie的值,形式是键值对;
expires:规定cookie过期时间,格式为形式为expires = someDate.toGMTString();
domain:指定cookie所在的域名,只有访问的域名匹配domain属性,cookie才会发送到服务器;
path:指定路径,只有path属性匹配向服务器发送的路径,cookie才会发送,只要path属性匹配发送路径的一部分,都可以发送;
secure:指定cookie只能在加密协议HTTPS下发送到服务器;
HttpOnly:设置cookie不能被js读取,这主要是放置XSS攻击盗取cookie;
一个完整的浏览器设置cookie写法:
3.Web Storage和Cookie的联系与区别
特性cookieWeb Storag
数据生命周期服务器生成的话,为指定失效时间;浏览器段生成的话默认为关闭浏览器后localStorage永久有效,除非使用localStorage.clear()清空;sessionStorage为关闭浏览器后;
存储空间一般为4K一般5MB~10MB
与服务器通信每次携带在HTTP头中仅在客户端,如需通信,可通过get或post方法
应用场景用户登录身份验证(结合HttpOnly相对安全性高)保存用户购物车信息以及HTML5游戏的本地存储
参考