cookie的设定及获取

cookiephp:setcookie(键名,数值,time()+时效)   设定cookie$_COOKIE[键名]                    获取cookieJavaScript:必须要自己封装函数来实现设定函数:获取当前时间对象的时间戳时间戳 - 8小时时差的毫秒数 + 时效的毫秒数将新时间戳设定给时间对象设定 cookie获取函数:参数是cookie字符串根据 ;空格 将字符串转化为数组创建对象循环遍历数组将数组的数据,按照 =等号分割为数组数组的0索引对应的内容,做对象的键名数组的1索引对应的内容,做对象的数据

cookie概念: 本质上就是一个建立在 浏览器文件夹中的 文件用于存储浏览器公共数据信息属性: cookie 都是以键值对的形式建立存在的键名 : cookie的键名数据 : cookie的数据时效 : cookie存在的时间默认是会话时效,一旦浏览器关闭,就会被删除设定时效,超过设定的时效,浏览器会删除cookie设定时效,以服务器时间为准,世界标准时中国时区 - 8小时 = 世界标准时设定cookiePHP : 设定setcookie()方法参数1:键名参数2:数据参数3:时效  time() + 设定的时效 单位:秒time()是PHP获取当前时间戳的方法获取通过预定义变量 $_COOKIE 来存储所有的cookie值$_COOKIE  是以数组的形式来存储,可以通过 $_COOKIE[索引键名]来获取具体的数据JavaScript中没有定义好的方法,我们只能自己定义设定:定义一个函数参数1:键名参数2:数值参数3:时效程序:1,获取当前时间,创建时间对象2,获取当前时间对象的时间戳3,当前时间戳 - 8小时时差的毫秒 + 时效的毫秒4,将计算后的时间戳,设定为当前时间对象的新的时间戳5,判断是否有时效参数如果有,赋值 时间对象如果没有,赋值 空字符串6,设定cookiedocument.cookie = '键名=数值;expires=时间对象或者空字符串';特别注意: cookie必须是键值对的形式cookie的设定,必须是字符串形式expires只接受时间对象或者空字符串如果直接写数值,会是会话时效获取cookie通过document.cookie只能获取到cookie字符串所有的cookie的数据的设定,实际上都是字符串类型必须将 cookie字符串 转化为 对应的 对象定义一个函数参数:cookie字符串程序:1, 根据 ;空格 将cookie字符串,转化为数组数组中的数据是 cookie 的键值对  也就是 name=张三2, 建立一个对象3, 循环遍历数组将数组的数据,根据 =等号 转化为数组数组的索引0是 cookie的键名数组的索引1是 cookie的数据将键名和数据,设定为 对象的键名和数据存储4, 循环结束,返回对象

一.定义

前端,后端程序,都可以设定cookieJavaScript,PHP,java,python所有的语言都可以设定操作cookieJavaScript中设定cookie设定和读取cookie都是  document.cookie变量 = document.cookie   是获取cookie数据document.cookie = 内容   是设定cookie数据获取 cookie 通过 document.cookie 来获取 cookie信息

通用版/最终简洁 utils.js

// 定义一个js外部文件
// 存储各种要使用的函数
// 将来通过外部文件的形式,来加载js文件,执行js函数// 设定cookie函数function mySetCookie(key,value,time){// JavaScript中,时间单位默认是毫秒// 获取当前时间对象const nowTime = new Date();// 当前时间的时间戳和服务器时间,有8个小时的时差 -8小时的毫秒数// 设定cookie时效时间 + 时间的毫秒数let t = nowTime.getTime() - (8*60*60*1000) + time*1000;// 将新的时间戳,设定给 时间对象nowTime.setTime(t);// 通过三元运算符,给 expires 赋值 如果没有时间参数,赋值空字符串,有时间参数,赋值时间对象document.cookie = `${key}=${value};expires=${time === undefined ? '' : nowTime }`;
}// 获取cookie函数function myGetCookie(cookieStr){const obj = {};const arr1 = cookieStr.split('; ');arr1.forEach((item)=>{const newArr = item.split('=');obj[newArr[0]] = newArr[1];})return obj;
}

二.setcookie.html设定

<script>// 1,必须要通过服务器运性前端程序,才会有cookie设定//   直接运行页面,设定cookie是有问题的// 2,设定cookie 必须是 键值对形式的字符串// '键名=数值' // 没有设定时效,默认是会话时效document.cookie = 'name=张三';// 3,给cookie设定指定的时效// 设定cookie的时间,是服务器时间,不是本地当前时间// 全世界的计算机,都可以设定各个时区的时间,没有办法统一,必须设定的是服务器时间,才可以统一// 服务器时间是世界标准时 与中国时区时差有 -8个小时的时差 // 设定cookie时间的语法// document.cookie = 'name=张三;expires=时间对象';// 将设个时间对象表示的时间,设定为cookie的时效// 例如,时间对象,表示的时间是 2020-5-1 0:0:0 (服务器时间)// cookie的时效,就是 2020-5-1 0:0:0 (服务器时间)// 设定一个函数,来执行定义带有时效的cookie// 参数1:键名// 参数2:数值// 参数3:时效---cookie的时效是当前时间开始,往后多少秒function mySetCookie(key,value,time){// JavaScript中,时间单位默认是毫秒// 1,获取当前时间对象const nowTime = new Date();// 2,获取当前时间对象中的时间戳// 当前时间的时间戳和服务器时间,有8个小时的时差let t = nowTime.getTime();// 3,减去8个小时(毫秒)的时差// 当期时间相对应的服务器时间戳 t = t - (8*60*60*1000); // 4,加上设定的cookie的时效性时间// 这个时效性就是cookie设定的时效性// time是秒,要转化为毫秒 ---  秒 * 1000t = t + time*1000;// 5,将时间戳,设定回时间对象// 时间对象,就具有了cookie设定需要的服务器时间戳nowTime.setTime(t);// 6,将这个时间对象,设定给cookie,作为时效性// 如果有 时间时效参数,设定cookie的时效是指定的时效时间// 如果没有 时间时效参数,应该设定的是会话时效// 通过三元运算符,来做判断// console.log(time);  如果没有给time传参,time是undefined// 如果 time 是 undefined 证明 time 没有输入参数//      给 a 赋值空字符串  a中就没有任何内容// 如果 time 不是 undefined 证明 time 有输入参数//      给 a 赋值计算后的 nowTime 时间对象let a = time === undefined ? '' : nowTime ;document.cookie = `${key}=${value};expires=${a}`;}// 每次执行,都是在当前时间基础上,给cookie增加60秒的时效// 刷新页面实际是重新执行设定cookie函数// 函数每次执行都会在当前时间基础上增加60秒时效// 要是页面没有设定 cookie函数的执行,不会影响 cookie时效的设定mySetCookie('age','18',3600);mySetCookie('sex','男',3600);mySetCookie('addr','北京',3600);// 删除cookie// 定义相同的键名,数值任意,时间是0或者负数都可以// 解释问题// 1, 直接设定cookie//    document.cookie = 'name=张三';//    会话时效,页面关闭,cookie就消失// 2, 通过函数设定//    mySetCookie('age','18',60);//    指定时效,只要不超过时间,cookie就会一直存在// 3, cookie不光是当前页面可以看到,同源的其他页面也可以看到//    一般是操作方式是//    在一个页面设定好cookie,在其他页面根据cookie来进行操作//    例如,在一个页面登录账号,同时设定cookie//    其他页面也可以读取这个cookie,只要有这个cookie,就可以不用再次登录了//    如果是会话时效的cookie,关闭页面,cookie小时,再次打开页面,就没有这个cookie,需要再次登录//    如果是设定时间的cookie,只要不超过这个事件,cookie都会存在,也就不需要再次登录了// 4, 关于cookie时效的计算//    (1),JavaScript中,所有的时间,默认都是毫秒,计算时,必须按照毫秒计算//    (2),服务器时间与中国时区时间,有8个小时的时差//        如果不计算这个时差,设定60秒时效,实际是8小时零60秒时效//    (3),要在当前时间戳继承上 增加 设定的 时效时间//        参数的时效时间是秒 * 1000 转化为 毫秒//        当前时间戳 - 8小时的毫秒 + 时效时间的毫秒// 5, 如果没有 时效时间 参数//    应该是设定为会话时效//    给 expires 通过三元运算符 赋值//    如果 time 是 undefined , 赋值空字符串 //    如果 time 不是 undefined , 赋值计算后的时间对象//    如果直接写不管有没有时间时效参数,都赋值 设定的时间对象//    看上去效果也是 会话事件时效 //    但是低版本的浏览器不支持这个效果,会设定为当前时间//    当前时间一执行,就会过期,就会直接删除//    为了兼容低版本浏览器,要写成赋值形式// 6, 删除cookie//    设定键名,数值任意,时间设定为 负数或者0 ,让cookie一设定就过期//    就不会出现在cookie// 7, 东时区,是当前时间 - N小时 是标准时间   东8区 当前时间 - 8小时//    西时区,是当前时间 + N小时 是标准时间   西8区 当前时间 + 8小时//    </script>

三.getcookie.html获取

<script>    // 获取当前的cookie// 获取内容是一个字符串// 格式 键名=数值;空格键名=数值;空格键名=数值// 字符串是没有办法直接使用的,必须要转化// 转化为对象,对象的键名就是cookie的键名,对象的数值就是cookie的数值// 必须要cookie的时效,只要有这个cookie键名数值就可以let cookieStr = document.cookie;console.log(cookieStr);// 定义一个函数来转化cookie字符串为对象// 参数:cookie字符串const cookieObj =  myGetCookie(document.cookie);console.log(cookieObj);function myGetCookie(cookieStr){// 定义一个对象// 在 { } 外定义变量,在 { } 中给变量赋值// 不影响变量的使用const obj = {};// 1,将cookie字符串,转化为数组,根据间隔符号 分号和空格const arr1 = cookieStr.split('; ');//  数组的形式 0:键名=数值 1:键名=数值....console.log(arr1);// 2,循环遍历arr1数组,键值对字符串的形式,要转化为 键名 数值独立的形式arr1.forEach((item)=>{// 以等号分割 键值对字符串,再定义成新的数组const newArr = item.split('=');// 数组 newArr 中 0是 键名 1是数值// console.log(newArr);// 要将 0存储的键名,设定成对象的键名// 要将 1存储的数值,设定为对象的数值// const obj ={};// 给对象添加单元// obj[变量] = 数据;obj[newArr[0]] = newArr[1];})return obj;}/*总结原因:JavaScript中,只能获取到cookie字符串必须将cookie字符串,转化为对象形式输入键名,可以获取数值步骤思路:1,定义一个函数,参数是 cookie字符串2,根据 ;空格  将 cookie字符串,转化为数组形式[0: 'name=张三',1: 'age=18',2: 'sex=男',3: 'addr=北京',]3,定义一个对象,来存储转化的结果4,循环遍历 数组,获取数据itemitem 存储的是就是 cooKie 键值对字符串name=张三    age=18    sex=男    addr=北京按照 = 等号 将 item 分割为数组0 存储键名name    1存储数值张三将0存储的键名作为对象的键名设定将1存储的数值作为对象的数值设定等于是 将 name=张三 字符串 设定为对象的单元 name:张三5,返回对象*/</script>

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！