浏览器cookie 分片存储

以下代码只针对companys键做了分片存储

新建cookie.js,内容如下：

/**

 * 存储tokens

 * @param {string} accessToken

 * @param {string} refreshToken

 */

export function cookieGO(key, value, time) {

  // 存储tokens tokens只进入cookies，不进入vuex全局管理

  if (time) {

    var time_t = 1000 * time;

  } else {

    var time_t = 1000 * 60 * 60 * 24 * 3;

  }

  var today = new Date();

  var expires = new Date();

  expires.setTime(today.getTime() + time_t);

  // escape(value)

  if (key == "companys") {

    // 此处value不可以json.stringfy

    setCookieData(key, value, 1000);

  } else {

    window.document.cookie =

      key + "=" + value + (";expires=" + expires.toGMTString()) + ";path=/";

  }

}



/**

 * 存储access_token

 * @param {string} accessToken

 */

// export function saveAccessToken(accessToken) {

//   cookies.set('access_token', `${accessToken}`)

// }



/**

 * 获得某个token

 * @param {string} tokenKey

 */

export function getCookie(name) {

  if (name == "companys") {

    return getCookieData(name);

  } else {

    var findcookie = name + "=";

    if (window.document.cookie.length > 0) {

      // if there are any cookies

      let offset = window.document.cookie.indexOf(findcookie);

      if (offset != -1) {

        // if cookie exists

        offset += findcookie.length; // set index of beginning of value

        let end = window.document.cookie.indexOf(";", offset); // set index of end of cookie value

        if (end == -1) end = window.document.cookie.length;

        return unescape(window.document.cookie.substring(offset, end));

        // return window.document.cookie.substring(offset, end);

      }

    }

    return null;

  }



  // return cookies.get(tokenKey)

}



/**

 * 移除token

 */

export function clearCookie(key) {

  if (key == "companys") {

    clearCookieData(key);

  } else {

    var d = new Date();

    d.setTime(d.getTime() + -1 * 24 * 60 * 60 * 1000);

    window.document.cookie =

      key + '=""' + ("; expires=" + d.toGMTString()) + ";path=/";

  }

}

// 针对数据较大的处理------------------------------------------------------start

// 将字符串按照 maxLength 分片，并存储到多个 cookie 中

function setCookieData(key, value, maxLength) {

  // 将字符串按照 maxLength 分割成多个部分

  const chunks = chunkString(value, maxLength);

  // 依次存储每个分片数据

  for (let i = 0; i < chunks.length; i++) {

    const cookieName = `${key}-${i}`;

    cookieGO(cookieName, chunks[i]);

  }

}

// 读取多个 cookie 分片，并按顺序合并还原为完整的数据

function getCookieData(key) {

  let data = "";

  let index = 0;

  while (true) {

    const cookieName = `${key}-${index}`;

    const chunkData = getCookie_step(cookieName);

    if (!chunkData) {

      // 已经读取了全部分片，退出循环

      break;

    }

    data += chunkData;

    index++;

  }

  return data;

}



// 将字符串按照 maxLength 分割成多个部分

function chunkString(str, maxLength) {

  const chunks = [];

  for (let i = 0; i < str.length; i += maxLength) {

    chunks.push(str.substr(i, maxLength));

  }

  return chunks;

}

// 获取 cookie

function getCookie_step(name) {

  const cookies = document.cookie.split(";");

  for (let i = 0; i < cookies.length; i++) {

    const cookie = cookies[i].trim();

    if (cookie.indexOf(`${name}=`) === 0) {

      return cookie.substring(`${name}=`.length, cookie.length);

    }

  }

  return null;

}

// 清除存储的分片数据

function clearCookieData(key) {

  let index = 0;

  while (true) {

    const cookieName = `${key}-${index}`;

    if (!getCookie(cookieName)) {

      // 已经没有剩余分片，退出循环

      break;

    }

    clearCookie(cookieName);

    index++;

  }

}

// 针对数据较大的处理------------------------------------------------------end

存储如下：

import { cookieGO } from "@/config/cookie.js";


 cookieGO("companys", JSON.stringify(res.companys));
 cookieGO("username", res.username);

获取如下：

import { getCookie } from "@/config/cookie.js";

let a = getCookie("realname")
let b = getCookie("companys")

清除如下：

import { clearCookie } from "@/config/cookie.js";

clearCookie("username");
clearCookie("companys");