cookie的api和封装
上一篇文章比照了下cookie，localstorage，sessionstroage三者的区别，其中讲到了cookie须要咱们专门封装一下，而剩下两个有专门的get、set办法。明天次要。看看cookie在理论我的项目中的封装。
首先看下cookie都有哪些属性办法。
其实就两个，一个读取，一个写入。
一、读取
allCookies = document.cookie咱们通过document.cookie就能够获取以后域名及其子域名下的所有cookie，它是以"; "（分号+空格）作为分隔符的键值对模式字符串。
比方你在mdn网站下关上控制台输出
document.cookie就会呈现
'_ga=GA1.2.1682758841.1619014911; preferredlocale=en-US; lux_uid=164510371039082338; _gid=GA1.2.750491686.1645103711'当然，不同电脑不一样哈。
二、写入
document.cookie = newCookie这里值得注意的是，newCookie也是一个字符串，它蕴含1+5个参数，别离是
1、由键名和键值组成的字符串，必填
“${name}=${value}”值得注意的是value最初如果是分号或者空格的话，会被删除，我也是刚体验了一下才晓得
2、path
;path=*path*path用来确定cookie随哪个申请收回去
假如你的浏览器以后曾经有了两个Cookie：
cookie1：name=name1; value=value1; path=/boyue/；
cookie2：name=name2; value=value2; path=/boyue/tongxue/。
当拜访http://localhost/boyue/*时，申请头中会蕴含cookie1，而不会蕴含cookie2。
当拜访http://localhost/boyue/tongxue/*时，申请头中会蕴含下面两个。
即，在拜访子门路时，会蕴含其父门路的Cookie，而在拜访父门路时，不蕴含子门路的Cookie。认真想想这点其实也挺合乎逻辑的，要不然这个参数也就没意义了。
3、domain
;domain=*domain*设置域。可能有同学感觉，我有了path为什么还须要domain这个参数，他次要是为了不同域名下共享或辨别一些参数，比方a.boyue.com和b.boyue.com是不同的域名，然而他们都能够拿到boyue.com下的cookie，却不能相互拿到。记得要带个“.”不然就是设置只有域名齐全一样了能力获取到这个参数。
4、max-age
;max-age=*max-age-in-seconds*这个好了解，就是设置一个多久后生效
5、;expires=date-in-GMTString-format
设置过期工夫和日期，跟下面的差不多
6、;secure
示意cookie是否只能通过https协定传输
如果是true的话，即便js获取到了对应的cookie，http申请也无奈携带该参数。
三、封装
封装次要就是批改它的写入、获取办法，尤其是获取办法，毕竟我须要的个别是对应的value而不是所有的键值对。上面简略实现一下
const cookie = { get: function (sKey) { // 依照存储的规定(不同键值对用分号和空格辨别，小属性用分号辨别)，先用“; ”进行切割，再取出外面第一个等号和第一个分号中的内容即可 return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[-.+*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null; }, // 写进去就完事了，会间接笼罩原来的键值对 set: function (sKey, sValue, vEnd, sPath, sDomain, bSecure) { if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false; } var sExpires = ""; if (vEnd) { switch (vEnd.constructor) { case Number: sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd; break; case String: sExpires = "; expires=" + vEnd; break; case Date: sExpires = "; expires=" + vEnd.toUTCString(); break; } } document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : ""); return true; }, // 设置对应的过期工夫小于以后工夫即可 remove: function (sKey, sPath, sDomain) { if (!sKey || !this.hasItem(sKey)) { return false; } document.cookie = encodeURIComponent(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + ( sDomain ? "; domain=" + sDomain : "") + ( sPath ? "; path=" + sPath : ""); return true; }};