深入解析Cookie机制:从操作实践到安全属性详解

cookie介绍

当你首次登录网站时,你会输入用户名和密码。在后台,网站的服务器验证这些凭据是否正确。一旦确认你的身份无误,服务器就会创建一个Cookie,并将其发送到你的浏览器。这了解Cookie登录:原理、实践与安全指南个Cookie包含了一个独特的身份验证令牌,它代表了你的登录会话。而这个包含用户一些信息的小型数据片段,就是Cookie。

跨站和跨域

两个Url的一级域名与二级域名相同就属于同站

两个Url的协议或是域名或端口号不同那就跨域了,跨域判断比跨站判断严格很多。

Cookie操作

再浏览器中输入document.cookie就可以得到部分的cookie信息,获取到的是一个字符串,使用split(';')将它及逆行切割,它的序列化方式是k1=v1;k2=v2;k3=v3

而浏览器中实际存储的可不止这四条cookie只要httpOnly被打上了钩那么使用JS是无法获取到这个cookie的,这种cookie只能用浏览器和服务端来进行操作,通常做种cookie使用来存储一些与用户身份信息或是安全相关凭证。

在浏览器中增加一条cookie的值也是使用document.cookie来进行操作

而要变更一条cookie的值是与新增是一样的,只要将需要变更的key值进行重新赋值就可以了,而删除操作就需要将cookie的key值设为空,同时将max-age=-1

代码执行后cookie面板的对应的这条cookie就会消失

Cookie的属性

key&value

每个cookie都有它对应的键名和值,获取cookie对应值的时候,可以把document.cookie返回的字符串使用split(';')进行分割分割后每条cookie都是kv对,把他们存入对象之后就可以比较方便的获取了使用了

domain

domain是cookie能做作用的主机地址,domain里面的东西非常多,首先domain不携带主机和端口,这个地方端口不同。协议不同都不会影响cookie,但是cookie的部分属性只有在HTTPS下才能生效

我们在https://a.com中写下了四个cookie

打开http://a.com这四个cookie依然存在,当把端口号改成1234的时候http://a.com:1234这四个cookie还是存在。这就是cookie的特性不区分协议和端口。

细心的同学已经发现了,有的domain最前面有一个点,有的没有。有点的domain就表示这个cookie可以作用于当前域及其子域。如果我们在新增cookie的时候没有带上domain,那么这个cookie只能作用于当前域。 但是当我们设置domain=a.com它的作用域却是.a.com,当我们设置domain=.a.com时它的作用域也是.a.com这点要记好。

最后就是在子域里面可以给父域设cookie,那么我们可以在a.com中获取到这个cookie,也可以在b.a.com获取到这个cookie,因为这个cookie是作用于a.com及其子域的。但是我们是不能从父域给子域设置domain,也不能跨域设置domain。

Path

path用来指定URL的路径,比如在a.com/a设置一个cookie这个cookie的path是/a,那么在a.com/a/b这个页面就也有这个cookie而在a.com/b这个页面就没有。

Expires & max-age

expires在指定时间失效 max-age多少秒之后失效 这两个属性同时存在时,max-age的优先级更高 max- age=- 1 删除cookie,0也是删除 max-age=60 则60秒之后删除cookie

当一个cookie既不设置expires又不设置max-age,那么这个cookie就是一个会话cookie,当浏览器被关闭时,这个cookie将会被清除。

httpOnly

httpOnly时和cookie安全性紧密相关的属性,前面说到过h't't'pOnly被打上了钩那么使用JS是无法获取到这个cookie的,这种cookie只能用浏览器和服务端来进行操作的。带有htppOnly的cookie只能由服务端通过响应标头中的set-cookie种在浏览器上面,js是无法获取到的。

Secure

secure这个属性告诉浏览器这个cookie只能用https协议传输,如果服务端的响应的从cookie中有secure这个属性,而当前页面的协议是http的,那么这个浏览器会忽略掉这个cookie。

这里我们在https协议的页面下创建一个带有secure的cookie,当我们向https://a.com发起请求的时候就会携带上这个cookie,而当向http://a.com发起请求的时候就不会有这个cookie的

Samesite

samesite属性可以限制跨站请求时cookie的发送。samesite的值是none,lax或者strict中的一个:

None不论是否跨站都发送cookie,虽然None是约束性最弱的,但是只有它是通过https协议进行传输时,浏览器才认为它有效,另外它必须要添加secure属性,不然将无法保存在浏览器上

Strict跨站不带cookie

Lax默认值,部分情况下携带cookie。具体情况如下表

相关推荐
熊猫钓鱼>_>4 小时前
动态网站发布部署核心问题详解
前端·nginx·容器化·网页开发·云服务器·静态部署
方也_arkling4 小时前
elementPlus按需导入配置
前端·javascript·vue.js
编程彩机4 小时前
互联网大厂Java面试:从分布式缓存到消息队列的技术场景解析
java·redis·面试·kafka·消息队列·微服务架构·分布式缓存
爱吃大芒果4 小时前
Flutter for OpenHarmony 实战: mango_shop 资源文件管理与鸿蒙适配
javascript·flutter·harmonyos
我的xiaodoujiao4 小时前
使用 Python 语言 从 0 到 1 搭建完整 Web UI自动化测试学习系列 44--将自动化测试结果自动推送至钉钉工作群聊
前端·python·测试工具·ui·pytest
沛沛老爹5 小时前
Web开发者转型AI:多模态Agent视频分析技能开发实战
前端·人工智能·音视频
David凉宸5 小时前
vue2与vue3的差异在哪里?
前端·javascript·vue.js
Irene19915 小时前
JavaScript字符串转数字方法总结
javascript·隐式转换
笔画人生5 小时前
Cursor + 蓝耘API:用自然语言完成全栈项目开发
前端·后端
AC赳赳老秦5 小时前
外文文献精读:DeepSeek翻译并解析顶会论文核心技术要点
前端·flutter·zookeeper·自动化·rabbitmq·prometheus·deepseek