cookie基本操作

  • 写入cookie,此处编码的时候使用encodeURIComponent,不使用encodeURI,因为encodeURI不能转义;等特殊字符,然而在cookie中若键或者值中有分号的话,cookie会被截断
// 写cookies setCookie(name, value) { const days = 30 const exp = new Date() exp.setTime(exp.getTime() + days * 24 * 60 * 60 * 1000) let encode_result = encodeURIComponent(String(value)) .replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g, decodeURIComponent); document.cookie = `${name}=${encode_result}; expires=${exp.toUTCString()}` }

  • 读取cookie,同样使用decodeURIComponent转码
// 读取cookies getCookies(name) { let arr, reg = new RegExp(`(^|)${name}=([^; ]*)(; |$)`) if (arr = document.cookie.match(reg)) { return decodeURIComponent(arr[2]) } else { return null } }

  • 删除cookie
// 删除cookies delCookies(name) { const exp = new Date() exp.setTime(exp.getTime() - 1) const cval = this.getCookies(name) if (cval) { document.cookie = `${name}=${cval}; expires=${exp.toUTCString()}` } }

  • 服务器响应会在头部设置cookie,比如
Set-Cookie: name=value

  • 【cookie基本操作】当设定了一个cookie后,再给创建它的域名发送请求时,都会包含这个cookie
  • 浏览器对cookie数有限制,firefox最多50个cookie,其余的浏览器更少
  • 最好将整个cookie长度限制在4095B以内,尺寸限制影响到一个域名下所有的cookie,而并非每个cookie单独限制,如果你尝试创建超过最大尺寸限制的cookie,那么该cookie会悄无声息的丢掉
  • 浏览器发送请求时会带上cookie,但是只会包含键值对,不会包含path,domain等,但是服务器响应可以返回。
  • 由于所有的cookie都会由浏览器最为请求头发送,所以在cookie中存储大量信息会影响到特定域的请求性能,cookie信息越大,完成对服务器的请求时间也就越长。所以最好还是尽可能少存储信息,避免影响性能

    推荐阅读