删除cookie有什么用(java删除cookie的两种方式)
前言
之前在django中分享了后台如何来设置cookie的:django实战006:cookie设置及跨域问题处理,那么如果我们想在前端设置cookie又该怎么来处理呢,今天为大家分享一篇vue中创建、读取、删除cookie的方法,希望对大家有所帮助。
cookie的形式
cookie和localstorage的有点不同,localstorage可以看作一个对象,通过键直接获取到对应的值,而cookie则是一串字符串,以=号区分键值,所以cookie在设置和获取时都无法直接实现。
//localstorage //设置方式 localstorage.setitem('test1',value1) //展现形式为对象 { 'test1':'value1', 'test2':'value2 } //获取方式 this.ip=localstorage.getitem('test1') //cookie //设置方式 document.cookie='test1=value1'; //展现形式为字符串 "test1=value1 ; test2=value2"; //获取方式 document.cookie
封装cookie方法
使用 document.cookie 属性来创建 、读取、及删除 cookie,为了能快速的处理cookie,我们将其常用的方法封装起来,比如设置,获取和删除。这里我们只要在使用的时候直接调用该方法即可快速实现对cookie的处理。
创建cookie
cookie是一串字符串,每个属性之间用‘;’隔开,属性间以‘=’号为区分,类型格式如 cookie1=value; cookie2=value; cookie3=value;所以这里我们要做的就是将用户输入的对应参数按照cookie的类型格式进行拼接。cookie*包含9个参数,分别是name、value、domain、path(默认‘/’)、expires/max-age、size(cookie大小)、http、secure、samesite。设置cookie必须包含nane和value,其他的允许为空,一般我们会多添加个expires/max-age超时限制。
setcookie(name,value,expire){ let d=new date() //实例化date d.setdate(d.getdate()+expire) //设置超时时间 window.document.cookie = name + "=" + value +';expires='+d.togmtstring() },
读取cookie
读取cookie则是要将刚才拼接的字符串进行分割,并拿到我们想要的数据,多个cookie或者参数之间用‘;’隔开,所以我们用一个数据通过split(‘;’)分割并存储起来,然后去遍历这个数组中的每组数据,找到我们想要的数据并提出出‘=’号后面的值即可,你也可以用正则来提取你想要的值 。
//方法一 getcookie(name){ var arry =document.cookie.split(';') console.log("arry=",arry) for(let i=0;i<arry.length;i++){ let temp =arry[i].trim().split('=') if(temp.indexof(name)==0) return temp[temp.indexof(name)+1] } return null }, //方法二,正则 getcookie(name){ var temp = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)') return temp ? temp[2] : null },
删除cookie
删除cookie我们只要再次调用创建cookie方法将对应的值清空即可,这里的-1让指定名为name的cookie过期实现自动清除,如果不赋值-1的话只是将对应的cookie值删除了,这条cookie记录并没有被删除。
delcookie(name){ this.setcookie(name,'',-1) },
js-cookie插件
以上是我们自己封装定义的cookie方法,如果你觉得麻烦也可以用别人的插件,如js-cookie,一款js操作cookie的轻量级插件,直接命令行安装插件:npm i js-cookie –save,当前版本2.2.1。
js-cookie使用
在组件中引入js-cookie,通过set、get、remove等方法来实现对应的创建、获取、删除等功能,用起来还是相当的简单快捷的。
//引入 import cookies from 'js-cookie' //创建 cookies.set('name',value) cookies.set('name', 'value', { expires: number }); //获取 cookies.get() //获取所有cookie cookies.get('name') //获取指定cookie //删除 cookies.remove('name')