摘要：可以通过来维护状态信息。就表示当前仅能在目录下使用。常用的操作及其函数实现方法可根据世界时把对象转换为字符串，并返回结果。浏览器支持会话恢复，保留。和标志只能通过传输，可以防止攻击。表示无法通过调用，防止中间人劫持。
0. 从http协议的无状态性说起
http 是无状态的协议
无连接：处理完一个请求就断开链接（http1.1以后可以实现长连接）
无状态：上一次会话与下一次会话没有联系。
可以通过 cookie 来维护状态信息。
1. cookie 存储大小：每条的存储空间为4k； 特点：- cookie没有显示的删除函数，可以设置 expire/max-age 过期时间，自动触发浏览器的删除机制。
- 服务器通过设置响应头来设置客户端的cookie，Set-Cookie: cookie-名=cookie值。可以同时添加多个Set-Cookie，从而设置多个cookie的值。
- 不允许存储敏感信息（用户名，密码等），一定要存储，要设置 cookie为 httponly， 另外考虑使用 非对称加密
- 浏览器 中的cookie 数量达到上限后，会删除旧的创建新的，删哪个由浏览器的策略决定
- cookie 通常与 session 一起使用。
- 登录时，server 端存储 用户信息相关的 session。
- server 端，生成的 sessionid 会放在cookie中，对应域名下就有了这个cookie。
- 以后会自动带这个 cookie，server 根据id 找到 session，获取用户信息。
基本操作
客户端：
// 读取： document.cookie // 设置： document.cookie = "myNmae=liulanqi;path=/;domain=.baidu.com";
服务端：
使用 setCookie 来设置，在设置多个 cookie的时候，得多写几个 setCookie。
设置cookie： document.cookie="userId=828";
document.cookie="userName=hulk";
此时浏览器将会维护两个cookie，分别为userId和userName；相当于：
document.addCookie("userId=828");
document.addCookie("userName=hulk");
如果要改变一个cookie的值，只需重新赋值，例如：
document.cookie="userId=929";
获取cookie：
var strCookie=document.cookie; console.log(strCookie); //userId=828; userName=hulk
- 只能一次获取所有的cookie的值，而不能指定cookie名称来获得指定的值。 - 如果在某个页面创建了一个cookie，那么该页面所在目录中的其他页面也可以访问该cookie。 - 为了控制cookie可以访问的目录，需要使用path参数设置cookie。document.cookie="userId=320; path=/shop";就表示当前cookie仅能在shop目录下使用。
常用的cookie操作及其函数实现：
addCookie(name, value, expireHours):
function addCookie(name,value,expireHours){
var exdate = new Date();
exdate.setTime(exdate.getTime() + expireHours * 60 * 60 * 1000);
document.cookie = name + "=" + escape(value) + ((expireHours == null) ? "" : ";expires=" + exdate.toUTCString());
}
toUTCString() 方法可根据世界时 (UTC) 把 Date 对象转换为字符串，并返回结果。
getCookie(name):
function getCookie(name){
let arr, reg = new RegExp(`^| ${name} = [^;]*;|$`);
if (arr = document.cookie.match(reg)) return arr[2];
else return null;
}
cookie的可选项：
expires/max-age: 设置过期时间。
expires是绝对时间，max-age是相对时间。
如果没有设置过期时间，则表示是一个会话期cookie，在关闭浏览器后，会被移除。
浏览器支持会话恢复，保留cookie。
正数，表示 多少秒后失效
负数，该 cookie 是临时 cookie，关闭浏览器就失效，浏览器页不会以任何形式保存该 cookie
为 0，表示删除 cookie
domain和path：
path，设置必须匹配的路径或者子路由才会发送cookie。如果路径设为/forums/，那么这个 Cookie 只有在访问www.example.com/forums及其子路径时才有效。
path 的设置，必须以 ‘/’结尾
domain 的设置，第一个字符必须是 ‘.’, 比如“.baidu.com”
domain标识指定了哪些主机可以接受cookie。如果没有设置，则是当前主机（不包含子域名），否则为设置的域名（包含子域名）。
secure和httponly：
secure标志cookie只能通过https传输，可以防止xss攻击。
httponly表示cookie无法通过javascript调用，防止中间人劫持。把cookie设置为secure，只保证 cookie 与服务器之间的数据传输过程加密，而保存在本地的 cookie文件并不加密。如果想让本地cookie也加密，得自己加密数据。
samesite：可以设置 SameSite：SameSite=Strict SameSite=Lax。则 cookie 不跨域发送。ajax中设置xhr.withCredentials = true;
： 问题：- 问题：“www.qq.com” 与 “sports.qq.com” 公用一个关联的域名”qq.com”，我们如果想让”sports.qq.com” 下的cookie被 “www.qq.com” 访问： - 解答：我们就需要用到cookie 的domain属性，并且需要把path属性设置为 “/“。例：document.cookie = “username=Darren;path=/;domain=qq.com“ - 问题：同域名的资源请求时，会默认带上本地的cookie，如何优化？ - 解答：将静态资源分组，分别放在不同的子域下（子域名请求时，是不会带上父级域名的cookie的）cookie 的跨域问题
域名、端口相同就不算跨域，协议可以不同。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/106259.html
摘要：保存中文上面我们的例子保存的是英文字符，下面我们来看下保存中文字符会怎么样。出异常了中文属于字符，英文数据字符，中文占个字符或者个字符，英文占个字符。如果为，则表示删除该。的值规定为域名的隐私安全机制决定是不可跨域名的。 什么是会话技术 基本概念: 指用户开一个浏览器，访问一个网站,只要不关闭该浏览器，不管该用户点击多少个超链接，访问多少资源，直到用户关闭浏览器，整个这个过程我们称为一...
摘要：追踪记录和分析用户行为。属性返回一个布尔值，表示浏览器是否打开功能不同浏览器对数量和大小的限制，是不一样的。请求的发送浏览器向服务器发送请求时，每个请求都会带上相应的。属性必须为绝对路径，默认为当前路径。属性值必须是当前发送的域名的一部分。 概述Cookie 与 HTTP 协议HTTP 回应：Cookie 的生成HTTP 请求：Cookie 的发送Cookie 的属性Expires，M...
摘要：首先先来一段总结用于本地数据存储，出现在服务器和浏览器交互的响应头部和请求头部中，受到单域名下的数量单个大小性能安全限制。子技术的出现缓解了单域名下的数量限制，关于子有一整套工具函数可以使用。 前言 本篇主要介绍Cookie技术的读书总结，但是我认为逻辑上最好会和Web Storage技术放在一起进行对比，因此后续会再总结一篇关于WEB存储的姊妹总结，敬请期待。 首先先来一段总结：Co...
摘要：首先先来一段总结用于本地数据存储，出现在服务器和浏览器交互的响应头部和请求头部中，受到单域名下的数量单个大小性能安全限制。子技术的出现缓解了单域名下的数量限制，关于子有一整套工具函数可以使用。 前言 本篇主要介绍Cookie技术的读书总结，但是我认为逻辑上最好会和Web Storage技术放在一起进行对比，因此后续会再总结一篇关于WEB存储的姊妹总结，敬请期待。 首先先来一段总结：Co...
阅读 3104·2021-11-11 16:54
阅读 3225·2021-10-11 10:58
阅读 1069·2021-08-30 09:41
阅读 1687·2019-08-30 15:54
阅读 1887·2019-08-30 14:00
阅读 2585·2019-08-29 17:13
阅读 1509·2019-08-29 15:19
阅读 438·2019-08-29 15:14
