关于cookie的使用

cookie是什么？

cookie是前端的本地存储，数据存储到浏览器中。

cookie只能存储4KB左右的数据，当发送网络请求时，浏览器中的cookie同时发送至后台。

没有设置过期时间的，浏览器彻底退出cookie也会清除；
需要设置过期时间的，在过期时间内，永久保存到浏览器中。

创建一条cookie

    document.cookie = "name=xxxx";
    document.cookie = "age=8";

修改某条cookie

document.cookie = "name=zzzzzzz"

设置过期时间

过期时间必须一条一条设置。

var newDate = new Date();
newDate.setDate(newDate.getDate() + 100);

document.cookie = "name=志志;expires=" + newDate.toUTCString();
document.cookie = "age=8;expires=" + newDate.toUTCString();

删除某条cookie

设置的cookie过期时间应早于当前时间。

var nowDate = new Date();
nowDate.setDate(nowDate.getDate() -1);
document.cookie = "name=志志;expires=" + nowDate.toUTCString();

取出浏览器的cookie

console.log(document.cookie);

将cookie变成json

document.cookie = "name=柳仁志";
document.cookie = "age=8";

方法一

function getCookieObj() {
    var theCookie = document.cookie;
    var cookieArr = theCookie.split(";");
    var cookieObj = {};

    cookieArr.forEach(function (item) {
        var tempArr = item.split("=");
        var theKey = tempArr[0].trim();
        var theValue = tempArr[1].trim();
        cookieObj[theKey] = theValue;
    });
    return cookieObj;
}

方法二

function getCookie() {
   
    let cookieArr = document.cookie.split("; ");
    let cookieDeilArr = [];
    for (let i = 0; i < cookieArr.length; i++) {
        cookieDeilArr.push(cookieArr[i].split("="))
    }
    console.log(Object.fromEntries(cookieDeilArr));
}