cookie基础

1.cookie的创建和删除

        let now = new Date();
        now.setMinutes(now.getMinutes() + 1); // 设置cookie生存期为1分钟
        document.cookie = "nickname=Joe;expires=" + now.toUTCString();

        console.log(document.cookie);
        
        setTimeout(() => {
            let now1 = new Date();
            now1.setMinutes(now1.getMinutes() -1); // 删除cookie
            document.cookie = "nickname=QQQ;expires=" + now1.toUTCString();
        }, 10000);

2.cookie的封装

        function setCookie(key, val, expires) {
            let now = new Date()
            now.setMinutes(now.getMinutes() + expires)
            document.cookie = `${key}= ${val};expires `+ now.toUTCString();

        }
        function removeCookie(key) {
            setCookie(key, null, -1)
        }

3.取得cookie里的数据

     function setCookie(key, val, expires) {
            let now = new Date()
            now.setMinutes(now.getMinutes() + expires)
            document.cookie = `${key}= ${val};expires `+ now.toUTCString();

        }
        function removeCookie(key) {
            setCookie(key, null, -1)
        }

        setCookie('age', 20, 30)
        setCookie('age1', 120, 30)
        setCookie('age2', 220, 30)
        setCookie('age3', 320, 30)

        // setTimeout(() => {
        //     removeCookie('age')
        // }, 5000);
        function getCookie(key) {
            let obj = {}
            document.cookie.split("; ").forEach(r => {
                let kv = r.split("=")
                obj[kv[0]] = kv[1]
            })
            if (key) return obj[key]
            return obj

        }
        console.log(getCookie());
        console.log(getCookie("age1"));
        console.log(getCookie("age2"));

4.写入js中，方便以后调用

     let sun = {
     setCookie(key, val, expires) {
        if (typeof val === 'object')
            val = JSON.stringify(val)
        let now =new Date()
        now.setMinutes(now.getMinutes() + expires)
        document.cookie = `${key}= ${encodeURI(val)};expires= `+ now.toUTCString();

    },
     removeCookie(key){
        this.setCookie(key,null,-1)

    },
     getCookie(key){
        let obj = {}
        document.cookie.split("; ").forEach(r => {
            let kv = r.split("=")
            let res =null
            let val =decodeURI(kv[1])
            try{
                res=JSON.parse(val)
            }catch(error){
                res=val
            }
            obj[kv[0]] =res
        })
        if (key) return obj[key]
        return obj
    }
}

调用例子

<script src="./sun.js"></script>
  <script>
      sun.setCookie('age',[20,'张三'],30)
      sun.setCookie('nickname',{age:200},30)
      sun.setCookie('gender','李四',30)
      sun.setCookie('tel',520,30)
      sun.removeCookie('tel')
      console.log(sun.getCookie());
      console.log(sun.getCookie('age'));
      console.log(sun.getCookie('nickname'));
      
  </script>