做前端已经两年了,却很少涉及到cookie方面的开发,也非常少关注cookie方面的知识,所以理解cookie非常浅显,
先说下自己浅显的理解吧:
cookie是基于http协议,cookie就是限制性的存储字符串的,我们可以通过document.cookie来存储字符串。
而最近手头上有个项目上涉及到有关于cookie的操作,即登录与退出,
对于这个需求,逻辑很简单
1.登录前的cookie检查
2.登录取的后端数据,再存到cookie
3.退出登录,清楚cookie.
这里面除了逻辑之外,涉及到了cookie取值和设值的问题。
这里我用到了jquery的第三方插件$.cookie来取值和设置。
根据之上的逻辑与$.cookie来取值和设值,这个任务很快就完成了,在本地apache测试没有问题。
接着就提交测试了,想不到问题马上出现了,目前的网站是a.xxx.com;而我们的另一个二级域名的网站b.xxx.com也有登录,即两个网站是可以设置document.domain="xxx.com"
在网站b.xxx.com登录成功后,已经写了个$.cookie("userid"), 在控制台打document.cookie="userid=112343",
第一次进a.xxx.com貌似是对的,因为$.cookie("userid")有值,所以也会进入已经登录状态,但点退出登录后,
再进b.xxx.com后还是登录状态。难道是cookie没有共享, 看下document.cookie="userid=112343;userid=0";
在这里很奇怪,在a.xxx.com退出登录时,已经设置了$.cookie("userid",0),但并没有覆盖之前的userid,而是追加了一个新的userid=0,之前的userid还存在。
看来清除cookie不是重新设置值这么简单。
在网上查了下资料,即清除cookie还需要增加个过期时间,即小过现在的时间就可以了,代码就修改成
$.cookie("userid", 0 , {expirs:new Date() -1000});
但还是没达到效果。
在这里也科普了下cookie的组成, cookie其实是由name,value, expires,path,domain等属性组成的,
如果写cookie的时候设置了path与domain, 则清除cookie时也需要设置相同的path,domain, 如果没有设置domain, 即取当前的location.host
所以原因找到了。
当b.xxx.com写cookie时设置了domain:xxx.com,和path:''/", 而我在a.xxx.com清cookie时只是设置了value和过期时间,并没有写domain和path, 所以并
没有清除原来的userid ,而是生成了新的userid,这个userid默认的domain为a.xxx.com,只是因为有过期时间,马上就消除了。但并没有清除之前的userid.
所以改代码为
$.cookie("userid",0,{expires:new Date()-1000, domain:"7k7k.com", path:"/"}
即清除了之前的userid.
总结:
1.cookie不是简单的name和value两个属性,还有expires,domain,path等属性,这个可以专门找cookie的概念来熟悉。
2.清cookie必须与设cookie时的domain与path一致。否则就不会清除而是追加。
cookie应该还有其他的很多方面的问题,希望大家可以帮笔者补充。
看来在技术之路上很多东西是需要自身实践的,自己感觉和亲自做过是两码事,要想成为高手,必须踩足够多的坑,有过足够多的总结才行。