cookie浏览器端的本地存储空间,用来存储一些数据
特点:
1.按照域名存储,那一个域名存储的,在当前域名下就可以访问,换一个域名就不能访问 2.按照文件路径存储,在那个文件夹下存储的数据,只能在那个文件夹及子文件夹访问,父级文件夹目录不能访问 3.cookie 的存储时按照字符串的形式存储 ’key=value; key=value;“ 4.存储大小4KB左右,50条左右 5.时效性,默认是会话级别的时效(关闭浏览器就没有了)可以手动设置cookie的时效(关闭浏览器后依旧保存) 6.操作权限,前后端都能操作 7.请求自动携带,只要cookie空间里面有数据,那么你在发送任何一个请求的时候,自动携带 前端操作cookie 想要使用或者操作cookie,页面必须是在服务器上打开的 1.document.cookie 读:document.cookie 会把cookie空间里面所有的数据全部拿出来,字符串的形式, 写:document.cookie = 'key=value' 写入一条cookie 设置cookie (重点) 1.一次只能设置一条 cookie 2.在设置的时候,每一条的分号后面可以书写对本条cookie的描述 expires过期时间 如果不进行特殊设置,默认就是会话级别的时效性,你要是想修改,expires=时间对象 path存储路径 如果你不进行特殊设置,会按照目前的目录结构进行存储,想修改 key=value;path=你要存储的路径 3.在设置的时候不管存储什么数据类型,都会自定转换成字符窜格式给你存储,cookie一般都是存储一些简单数据 4.设置同名的cookie就是修改,前提是相同路径下 5.在设置的时候,如果设置一个cookie的过期时间是当前时间以前,就是删除这条cookie,在到达过期时间的那一瞬间,这一条cookie就已经从浏览器移除了document.cookie = 'a=100;path=/' document.cookie = 'a=100;expires=' + new Date() document.cookie = 'b=200;expires=Tue Aug 25 2020 17:00:00 GMT+0800(中国标准时间)'
封装好的设置cookie的方法
1 /** 2 * setCookie 设置cookie的方法 3 * @param { STRING } key 要设置的cookie名 4 * @param { STRING } value cookie的value 5 * @param { NUMBER } expires 多少秒以后过期 6 * @param { STRING } path cookie的存储路径 7 */ 8 function setCookie (key, value, expires, path) { 9 // 1.准备一个标准cookie内容 10 var str = key + '=' + value 11 if (expires) { 12 // 处理时间 13 var time = new Date() 14 time.setTime(time.getTime() - 1000*60*60*8 +expires *1000) 15 str += ';expires=' + time 16 } 17 if (path) { 18 str += ';path=' + path 19 } 20 document.cookie = str 21 }
封装好的获取cookie方法
1 /** 2 * getCookie 获取cookie的方法 3 * @param { STRING } key 你要获取的某一个cookie的key 4 * @returns { STRING | OBJECT } 填写参数是指定的值,不填写是对象 5 */ 6 function getCookie (key) { 7 var tmp = document.cookie.split('; ') 8 var o = key ? '' : [] 9 tmp.forEach(function (item) { 10 var t = item.split('=') 11 if (key) { 12 if(t[0] === key) { 13 o = t[1] 14 } 15 } else { 16 o[t[0]] = t[1] 17 } 18 }) 19 return o 20 }