cookie
用于在客户端存储会话信息。
构成
- 名称:唯一标识 cookie 的名称。cookie名不区分大小写, 但是一些服务器软件会区分,为了避免出错,建议区分使用。
- 值:存储在cookie里的字符串值。
- 域:cookie有效的域。发送到这个域的所有请求都会包含对应的cookie。
- 路径:请求URL中包含这个路径才会把cookie发送到服务器。默认情况下,cookie 属于当前页面。
- 过期时间::表示何时删除cookie的时间戳(即什么时间之后就不发送到服务器了)。默认情况下,浏览器会话结束后会删除所有cookie。
- 安全标志:设置之后,只在使用SSL安全连接的情况下才会把cookie发送到服务器。
限制
- 不超过300个cookie;
- 每个cookie不超过4096字节;
- 每个域不超过20个cookie;
- 每个域不超过81 920字节。
不同浏览器的限制也不同
- 最新版IE和Edge限制每个域不超过50个cookie;
- 最新版Firefox限制每个域不超过150个cookie;
- 最新版Opera限制每个域不超过180个cookie;
- Safari和Chrome对每个域的cookie数没有硬性限制。
如果创建的cookie超过最大限制,则该cookie会被静默删除,所以cookie存一些短的字段,相对长一些的建议存Storage。
创建cookie
document.cookie="username=123";
cookie设置过期时间(以 UTC 或 GMT 时间)
document.cookie="username=123; expires=Thu, 18 Dec 2023 12:00:00 GMT";
永久 cookie 可以用Fri, 31 Dec 9999 23:59:59 GMT作为过期日或者世界末日 Tue, 19 Jan 2038 03:14:07 GMT
使用 path 参数告诉浏览器 cookie 的路径
document.cookie="username=123; expires=Thu, 18 Dec 2023 12:00:00 GMT; path=/";
获取全部cookie
var x = document.cookie;
修改cookie
document.cookie="username=456; expires=Thu, 18 Dec 2023 12:00:00 GMT; path=/";
删除(设置 expires 参数为以前的时间即可)
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";
如果您需要查找一个指定 cookie 值,您必须创建一个JavaScript 函数在 cookie 字符串中查找 cookie 值。
大佬们可以尝试组件封装一个操作方便的辅助方法
下面推荐开源库--js-cookie工具库
Cookies.set('name', 'value', { expires: 7, path: '' })
Cookies.get('name') // => 'value'
Cookies.get('nothing') // => undefined
Cookies.remove('name')
...