浏览器缓存cookie和storage

1.cookie在没有域名的情况下,能存进去么?

场景:在本地存cookie进去,document.cookie='name=1';发现直接打开此页面竟然没有没有存入到cookie中,然后换成webstorm打开(run起来),发现是存进去了的,总结,在没有域名的时候cookie是存不进去的

2.在sessionStorage和localStorage没有某个key值的时候?(sessionStorage和localStorage结果相同)

场景:当sessionStorage中无username这个key值的时候,使用sessionStorage.getItem('username')得到的结果是null,而使用sessionStorage.username和sessionStorage['username']得到的值是undefined;

3.关于storage事件?

网上看到一句这样的话,很有道理,如下:storage事件是指在同源策略下的两个页面,一个页面触发了localStorage中的值改变了,就会触发另一个页面的storage事件
注意:
1.首先得有两个页面,一个页面改变localStorage的值,另一个绑定storage的事件;
2.绑定storage事件的方法是window.addEventListener('storage',fun,false);
3.sessionStorage是没有这个事件的噢~(因为sessionStorage适用于顶层窗口,更换tab页都拿不到值)
storage事件有以下几个属性:
key:被修改或者被移出项的key,如果是使用clear()来清除,则为null
oldValue:改变或者删除前的value值,如果是插入的新项,则为null(clear的时候也为null)
newValue:改变或者删除后的value值,如果是removeItem(),则为null
storageArea:这个属性就好比window对象上的sessionStorage对象或者localStorage对象
url:触发该变化的文档的url

4.在看书的接触到一句话,存入sessionStorage中的属性的值必须是string?

经过验证表明,6大类型存入sessionStorage中的值,表现的和转换成toString差不多,除了null和undefined之外,null和undefined不能toString会报错,但是存入是可以的,会转换成为'null'和'undefined',这里提一嘴,之前看到有人用***.toString返回的是function,因为toString是对象的原型当中的一个方法

5.关于Date.parse的使用?

Date.parse(参数),参数为日期格式的string,返回值是1970,01,01到参数的毫秒数

6.关于sessionStorage和localStorage的有效期和作用域?

sessionStorage:sessionStorage的顶级窗口关闭,即sessionStorage会消失,同源的可以取到sessionStorage的值,即如果一个页面的tab页并没有关闭,将同源的链接拷贝到这个tab页面,是可以拿到这个tab页面的sessionStorage的值,注意,如果在一个tab页面加载了一个同源的页面,另一个tab页面也加载了一个同源的页面,这两个tab页面的sessionStorage是不能共享的

localStorage:localStorage的有效期是永久的,除非用户删除这个localStorage的值,localStorage遵循同源(同协议,同主机名,同端口)和同浏览器的原则,如:在不同的浏览器存的localStorage的值是不能相互取到的,在同一浏览器的不同tab页面之间localStorage的值是可以相互取到的(注意都是同源的情况下)
注意:在一个页面中,如果有两个iframe,如果这两个iframe同源,则这两个iframe是可以共用sessionStorage和localStorage的

7.sessionStorage和localStorage拥有的一些方法?(二者一样)

存储数据:sessionStorage.setItem('key','value')/sessionStorage.key = value/sessionStorage[key]=value
取值:sessionStorage.getItem('key')/sessionStorage.key/sessionStorage[key]
删除单个值:sessionStorage.removeItem('key')/delete sessionStorage.key(注意ie8不兼容)
清除所有:sessionStorage.clear()

8.关于sessionStorage和cookie的存储量的区别?

看到网上有这样的说法:sessionStorage和localStorage的存储量是5M,而cookie中的存储量是4KB(浏览器中允许存储的cookie是不超过300个(是标准,但是很多浏览器都超过了300个),每个不超过4kb,)

9.关于cookie的作用域和有效期?

其实cookie和sessionStorage和localStorage都有点像,比如说:
cookie在没有设置时间的时候,也是浏览器关闭cookie就会消失,但是是浏览器关闭才会消失,并不是tab页关闭会消失(注意刷新浏览器cookie是不会消失的)
所以:cookie和sessionStorage的相同点是会消失(哈哈),cookie是关闭浏览器消失,sessionStorage是关闭tab页消失
cookie和localStorage的相同点是不同的tab页面是可以共享这个cookie值的
cookie的作用域和domain和path有关,在不设置这两个值的时候,默认的domain是当前的域名(如www.baidu.com),默认的path就是当前的目录(如http://localhost:63342/lianxi/canvas/%E5%85%B3%E4%BA%8Edocument.html就是/lianxi/canvas)
path有个原则,即cookie只能共享到这个兄弟目录和子目录下
domain就是只能在这个站内使用
关于设置path,如果希望这个cookie在整个站内可以使用,将path设置成path=/即可,还可以设置成别的,但是都是遵循path的原则的,注意path是可以不设置成当前页面相关的目录的(在设置path的路径为中文的时候,发现存不进去)
关于设置domain,如果希望这个域名下的其它主机名是可以使用的,是可以设置成domain=.example.com(注意在设置domain的时候是设置成当前域的)这样,o.example.com和l.example.com都可以取到这个cookie;
设置cookie的key,value值的方法,如document.cookie = "username=yangying";这样可以将username存入到cookie中去,也可以存入多个值,存储的方式可以为document.cookie="username=yangying&age=1",也可以取别的分隔符,存入的值是yangying&age=1,建议不要这样存储,可以一个一个存储,
注意,如果名字不同是不同的cookie的,path不同也是两个不同的cookie,domain不同也是不同的cookie;
注意,一般cookie的值都应该编码一些存储
关于secure,默认是不安全的,一旦设置了secure即为安全的,不安全的有http传递及其他,安全的是https及其它
关于有效期,默认不设置的话,是浏览器关闭即消失,设置的话有两个属性expires和max-age,二者是一个意思,现在max-age渐渐替换了expires,关于二者的使用方法,max-age的单位是秒,直接设置max-age=10即为过10秒过期,expires是设置未来过期的时间是多少(如Wed, 19 Jul 2017 09:39:18 GMT),即到了这个时间的时候就会过期,注意设置的时间是Date的string格式,可以采用toGTMString来将Date对象转换
注意每一个值要用;(分号)隔开,如document.cookie="key=value;max-age=;path=;domain=***;secure";
注意如果设置了max-age的时候,即使不关闭浏览器,只要到了这个时间cookie也会删掉
在练习的时候接触到setTime(参数)方法,有几个误区,下面讲解一下,首先这个方法会返回setTime里面的参数,该方法是将date对象设置成某个时间点,接受的参数是相当于1970,01,01的毫秒数,
console.log(new Date().setTime(new Date().getTime()+5000))=>返回当前时间多5000毫秒的毫秒数
var a = new Date();
a.setTime(new Date().getTime()+5000);
console.log(a);=>将a设置成了当前时间多5000毫秒的Date对象,如(Wed Jul 19 2017 17:51:45 GMT+0800 (中国标准时间))

10.如何存储cookie和删除cookie?

存储cookie:document.cookie="key=value";
删除cookie:将cookie的有效时间设置为0,即max-age = 0;

11.如何取得cookie值?

cookie的取值和cookie的存值比较类似,但是cookie的取值只能取出key和value值,取出来后,将其转换成一个数组,并循环数组存入对象中

以上都是个人理解如有不对之处还望指正交流!

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,732评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,496评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,264评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,807评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,806评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,675评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,029评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,683评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,704评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,666评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,773评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,413评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,016评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,204评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,083评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,503评论 2 343

推荐阅读更多精彩内容