每周分享之cookie详解

简介:     本章从JS方向讲解cookie的使用。(实质上后端代码也是差不多用法,无非读取和设置两块)     基本用法:document.cookie="username=pengpeng"; 修改的时候也是这句,重新赋值即可。

    本章从JS方向讲解cookie的使用。(实质上后端代码也是差不多用法,无非读取和设置两块)

    基本用法:document.cookie="username=pengpeng"; 修改的时候也是这句,重新赋值即可。

    一般的,cookie是记域名的,上面的写法,比如在www.test.com域名下生效,但是不会在www.test.com/p123.html下生效,因为默认的cookie是不跨URL子目录的,就是说cookie只记录在当前url下,首页的cookie是首页的,列表页是列表页的,哪怕cookie名称都叫username,它们也互不影响。

    实际项目中我们肯定是不允许这种情况存在的,首页和列表页以及终端页等页面的cookie必须共享,这个时候就需要设置一下path, 写法:document.cookie="username=pengpeng;path=/"; 这个时候同一域名下的cookie共享,一般不会存在首页设置的cookie在其他页获取不到。

    但也有特例,最近公司项目里就遇到了,问题出在一些叫个人中心以及帮助中心的页面,域名变了,准确的来说,二级域名变了 原本是www.test.com的,个人中心的域名是account.test.com,这个时候设置了path也没用, 此时已跨域,而cookie默认不跨域,是的,既然我说默认了,那肯定是有解决方案了,那就是domain属性! 

    写法:document.cookie="username=pengpeng;path=/;domain=test.com";

    注意,domain后面写的是主域.com,只有这个时候浏览器里的cookie才是跨子域的!(但实际上主域是没法跨域的,最多跨子域,也就是最多实现二级域名、三级域名的cookie共享)。

    最近被这个坑的不轻,在公司丢人了,当时和公司产品说cookie不能跨域,差点改了需求,虽然是小改,虽然她们好像也不知道我的这个尴尬事,不过还是挺醉的(*/ω\*) 

 

    用法基本就是上面提到的几点了,注意事项也提到了,主要是path和domain的设置注意一下就行。关于为什么用cookie,主要是方便,因为这东西是记录在浏览器里的,很多的用户行为能直接存储在用户的这边(顺便提一下,用户的数据如果全都存服务端,会给服务器带来巨大压力,特别是用户量大的时候,所以这也是cookie的一个好处,减轻服务器压力),不过总的来说,cookie只适合做少量存储,或者临时性存储,毕竟浏览器是可以清理缓存和cookie的。

    既然提到客户端和服务端的概念,所以也可以引深一下别的概念,cookie的好处在于客户端存储,减轻服务端压力,但是有时候我们的一些数据(非用户数据相关的或者是一些共享信息),我们希望大家都用,那么这个时候就不能存在客户端了,不然你的我用不了,我的你用不了,所以session的好处就体现出来了,这也是我要引深的一个地方,session是存储在服务端的,所以能实现信息的共享或者完成和服务器的一些信息交互。

    cookie和session都是少量信息的存储,一个存在客户端,一个存在服务端,根据各自的场景使用即可。(前端方向一般cookie使用比较多,session很少,使用cookie需要注意一点,总大小,4KB!!)

    

     除了session需要了解一下以外,application也可以了解一下,为了省事找了一张图,很详细的对比了:

      

     嗯,以上已经很详细说明了各个存值的场景和区别,不同情况的会分别去使用,application基本上我没见过,很少有人用,客户端cookie,服务端session、cache,webconfig一般后端在程序里灵活配置的时候会用到。对了,JS浏览器存储,除了cookie,还有一个叫本地存储的黑科技,这个可比cookie存的东西多多了,相当于一个小数据库,一个小的前端数据库,可以存很多东西,学名Local Storage,这个用起来也挺简单,就不赘述了,了解一下就行~~

 

     以上内容如果疑问欢迎指出,有兴趣的道友也可以一起讨论,一起学习一起进步!

 

目录
相关文章
|
敏捷开发 开发框架 持续交付
深入探讨敏捷开发项目管理流程与Scrum工具:构建高效团队与卓越产品的秘诀
深入探讨敏捷开发项目管理流程与Scrum工具:构建高效团队与卓越产品的秘诀
蓝易云 - 如何追踪discord.js中删除消息的用户?
这个例子中,我们直接从被删除的消息中获取到了消息的作者。请注意,这个例子假设消息是由消息的作者自己删除的。
137 2
|
安全 网络协议 Unix
端口和安全
端口和安全
|
安全 中间件
学习 | egg.js 中间件和插件
小小又开始学习了,这次学习的是中间件和插件。 这次将会对这两个点,进行学习。
1042 58
|
前端开发 JavaScript Java
前端页面使用DataTables无刷新更新数据
前端页面使用DataTables无刷新更新数据
515 0
|
SQL NoSQL MongoDB
MongoDB数据库【基本语法内容】2
6.更新文档 update() 方法用于更新已存在的文档。语法格式如下:
277 2
MongoDB数据库【基本语法内容】2
|
C语言
c语言第二课------地基打牢,基础打紧,不可放弃1
c语言第二课------地基打牢,基础打紧,不可放弃
|
Linux Windows
16.13 Linux GRUB手动安装
需要手工安装 GRUB 主要有两种情况:
509 0
16.13 Linux GRUB手动安装
|
编解码 缓存 开发工具
Unity跨平台UI解决方案:可能是最全的FairyGUI系列教程-第三天
众所周知,人生是一个漫长的流程,不断克服困难,不断反思前进的过程。在这个过程中会产生很多对于人生的质疑和思考,于是我决定将自己的思考,经验和故事全部分享出来,以此寻找共鸣!!!
912 0
FL Studio2022免费版DAW音乐编曲制作软件
说到电音已经不是很新鲜的话题了,在这个自媒体视频为王的年代,相信很多年轻人都想成为一个优秀的up主,在各大媒体网站上上传一些自己录制的游戏剪辑,再配上一段劲爆的电音,可能视频就会从3分变成7分的评价了。筱黑君也是一个超级电音迷,最爱AVICII,可惜,被上帝叫去创作电音了。一直都希望自己也能创作电音,但是缺乏乐理知识的筱黑君,只能为广大的电音爱好者提供一些其他方面的帮助了。
425 0