JS手动添加浏览器cookie，以及cookie的获取和删除（基于vue）

JS手动添加浏览器cookie

在App.vue的created()函数中添加如下代码

// 线上测试时需注释
    this.$cookies.set(
      "authtoken",
      "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1SWQiOiIxMjAzNSIsIkFjY0lkIjoiN2Y1NTM2MmI3MTg3NDI2ZTg5OTdiM2VZTc1M2I4MWYiLCJleHAiOjE1OTg5MjU2NDF9.rlJl-Zg3ngPjbqB1BO3tnT8Sff4dAkzfZhYjsBeqSc4"
    );
    this.$cookies.set(
      "userInfo",
      "%7B%22UserId%22%3A%227f55362b7187426e8997b3ece753b81f%22%2C%22Name%22%3A%22%E5%BE%AE%E6%BE%9C%22%2C%22NickName%22%3A%22u18656081516406%22%2C%22Avatar%2%3A%22Avatar.CHEFY447019968.png%22%7D"
    );

结果如图：

获取cookie

在App.vue中获取时：

this.$cookies.get("authtoken")

在页面级组件中获取时（通用获取方法）

// 线上测试时
let ckArr='', reg = new RegExp("(^| )userInfo=([^;]*)(;|$)");
    if (ckArr = document.cookie.match(reg))
        this.cookieInfo = JSON.parse(unescape(ckArr[2]));

// 本地测试时：
let ckArr='', reg = new RegExp("(^| )userInfo=([^;]*)(;|$)");
    if (ckArr = document.cookie.match(reg))
        this.cookieInfo = unescape(ckArr[2])

JS删除cookie（会删除所有cookie）

let cookies = document.cookie.match(/[^ =;]+(?=\=)/g)
          if(cookies){
            for(let i = cookies.length;i--;){
              document.cookie = cookies[i] + '=0;expires=' + new Date(0).toUTCString()
            }
          }