您好,欢迎来到二三四教育网。
搜索
您的当前位置:首页说说HTTP Cookie

说说HTTP Cookie

来源:二三四教育网

2016/07/02
粗略整理一下cookie操作。

是什么

它是服务器发送到浏览器并保存在浏览器中的一块数据,是浏览器的存储数据的一个机制,它随每一次HTTP请求传递至服务器,所以可以用来存储一些验证信息,比如token等。
用脚本可以以生成,也可以访问,它挂在document对象上:

var _cookie = document.cookie

有哪些属性

// 以下演示 cookie 对象有哪些属性
// 这是在浏览器控制台显示的字段名,实际设置的时候全部小写即可
var _cookie = {
  Name, // 键
  Value, // 值
  Domain, // 生效的域名
  Path, // 生效页面路径,相对于 Domain
  Expires/Max-Age, // 生效时间,默认值为 Session
  Size, // 大小,单位 Byte,不特别设置
  HttpOnly, // true 则禁止 JS 读取
  Secure // 是否采用 HTTPS 传输
}

注意点

操作

脚本操作cookie只跟HTML文件位置有关系,与脚本文件从哪里引入无关。

Expires/Max-Age

  • 默认值为Session,随着浏览器关闭而删除,注意是浏览器关闭,不是标签页关闭
  • 否则,值为Date类型,失效则不随HTTP上传至服务器,而且无法自动删除

Domain

默认值为当前页面所在的域名。

域名

  • 顶级域名
  • 一级域名
  • 二级域名
  • 二级域名

跨域

Path

为当前HTML文件在服务器的路径。

举个“栗子”

  • A --- 网址,在这个HTML页面的脚本中设置的cookiepath属性的值为/test
  • B --- 网址,在这个HTML页面的脚本中设置的cookiepath属性值为/test/page

B 中脚本只可以读取以下页面中设置的cookie

  1. /test/page
  2. /test
  3. /

再注意

不同path下可以设置相同名字的cookie

HttpOnly

这个属性的值一般在服务器设置,设置为true,这样在脚本中无法读取。

Secure

见下文设置。

怎么设置

最简单

在当前页面设置一个名字为token,值为123cookie

document.cookie = 'token=123';

设置其他属性

方法就是在上一步的基础上,加上;属性名=属性值

var d = new Date('2999-01-01');
document.cookie = 'token=123;expires=' + d.toGMTString();

所有属性设置了不正确的值,都会导致cookie不生效。
另外,如果属性值为中文,需要被十六进制的转移序列替换:

var userName = '反恐小柒';
document.cookie = 'username=' + encodeURIComponent(userName);

再另外,secure没有值:

document.cookie = 'token=123;secure';

注意

对同一个名字的cookie设置,后面的值覆盖前面。

怎么获取

// 比如已经设置了两个 cookie
// key1=1
// key2=2
console.log(document.cookie); // key=1; key2=2

注意;号后的空格。

怎么删除

等同你设置这个cookie的代码,只是将expires的值设置为过去的某个时间即可。

资源

Copyright © 2019- how234.cn 版权所有 赣ICP备2023008801号-2

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务