feat(projects): 添加cryptojs，对本地缓存数据进行加密

package.json

@@ -31,15 +31,16 @@
     }
   },
   "dependencies": {
-    "@antv/g2plot": "^2.4.4",
+    "@antv/g2plot": "^2.4.5",
     "@better-scroll/core": "^2.4.2",
-    "@vueuse/core": "^7.4.1",
+    "@vueuse/core": "^7.5.1",
     "axios": "^0.24.0",
     "chroma-js": "^2.1.2",
     "clipboard": "^2.0.8",
+    "crypto-js": "^4.1.1",
     "dayjs": "^1.10.7",
     "form-data": "^4.0.0",
-    "naive-ui": "^2.23.1",
+    "naive-ui": "^2.23.2",
     "pinia": "^2.0.9",
     "print-js": "^1.6.0",
     "qs": "^6.10.2",
@@ -47,20 +48,21 @@
     "vditor": "^3.8.10",
     "vue": "^3.2.26",
     "vue-router": "^4.0.12",
-    "wangeditor": "^4.7.10",
+    "wangeditor": "^4.7.11",
     "xgplayer": "^2.31.4"
   },
   "devDependencies": {
     "@amap/amap-jsapi-types": "^0.0.8",
-    "@commitlint/cli": "^15.0.0",
+    "@commitlint/cli": "^16.0.1",
-    "@commitlint/config-conventional": "^15.0.0",
+    "@commitlint/config-conventional": "^16.0.0",
-    "@iconify/json": "^1.1.447",
+    "@iconify/json": "^1.1.450",
     "@iconify/vue": "^3.1.1",
     "@types/bmapgl": "^0.0.5",
     "@types/chroma-js": "^2.1.3",
+    "@types/crypto-js": "^4.1.0",
     "@types/qs": "^6.9.7",
-    "@typescript-eslint/eslint-plugin": "^5.8.0",
+    "@typescript-eslint/eslint-plugin": "^5.8.1",
-    "@typescript-eslint/parser": "^5.8.0",
+    "@typescript-eslint/parser": "^5.8.1",
     "@vitejs/plugin-vue": "^2.0.1",
     "@vue/compiler-sfc": "^3.2.26",
     "@vue/eslint-config-prettier": "^7.0.0",
@@ -69,7 +71,7 @@
     "cz-conventional-changelog": "^3.3.0",
     "cz-customizable": "^6.3.0",
     "dotenv": "^10.0.0",
-    "eslint": "^8.5.0",
+    "eslint": "^8.6.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-import": "^2.25.3",
@@ -82,17 +84,17 @@
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.5.1",
     "rollup-plugin-visualizer": "^5.5.2",
-    "sass": "^1.45.1",
+    "sass": "^1.45.2",
     "typescript": "^4.5.4",
-    "unplugin-icons": "^0.12.23",
+    "unplugin-icons": "^0.13.0",
-    "unplugin-vue-components": "^0.17.10",
+    "unplugin-vue-components": "^0.17.11",
     "vite": "~2.5.10",
-    "vite-plugin-html": "^2.1.1",
+    "vite-plugin-html": "^2.1.2",
     "vite-plugin-mock": "^2.9.6",
     "vite-plugin-windicss": "^1.6.1",
-    "vue-tsc": "^0.30.0",
+    "vue-tsc": "^0.30.1",
-    "vueuc": "^0.4.18",
+    "vueuc": "^0.4.19",
-    "windicss": "^3.4.0"
+    "windicss": "^3.4.2"
   },
   "homepage": "https://github.com/honghuangdc/soybean-admin",
   "repository": {

src/utils/crypto/index.ts

@@ -0,0 +1,27 @@
+import CryptoJS from 'crypto-js';
+
+const CryptoSecret = '__CryptoJS_Secret__';
+
+/**
+ * 加密数据
+ * @param data - 数据
+ * @param secret - 密钥
+ */
+export function encrypto(data: any) {
+  const newData = JSON.stringify(data);
+  return CryptoJS.AES.encrypt(newData, CryptoSecret).toString();
+}
+
+/**
+ * 解密数据
+ * @param ciphertext - 密文
+ * @param secret - 密钥
+ */
+export function decrypto(ciphertext: string) {
+  const bytes = CryptoJS.AES.decrypt(ciphertext, CryptoSecret);
+  const originalText = bytes.toString(CryptoJS.enc.Utf8);
+  if (originalText) {
+    return JSON.parse(originalText);
+  }
+  return null;
+}

src/utils/storage/local.ts

@@ -1,21 +1,37 @@
+import { encrypto, decrypto } from '../crypto';
+
+interface StorageData {
+  value: unknown;
+  expire: number | null;
+}
+
 /** 默认缓存期限为7天 */
 const DEFAULT_CACHE_TIME = 60 * 60 * 24 * 7;
 
 export function setLocal(key: string, value: unknown, expire: number | null = DEFAULT_CACHE_TIME) {
-  const json = JSON.stringify({ value, expire: expire !== null ? new Date().getTime() + expire * 1000 : null });
+  const storageData: StorageData = { value, expire: expire !== null ? new Date().getTime() + expire * 1000 : null };
+  const json = encrypto(storageData);
   window.localStorage.setItem(key, json);
 }
 
 export function getLocal<T>(key: string) {
   const json = window.localStorage.getItem(key);
   if (json) {
-    const data = JSON.parse(json);
+    let storageData: StorageData | null = null;
-    const { value, expire } = data;
+    try {
-    /** 在有效期内直接返回 */
+      storageData = decrypto(json);
+    } catch {
+      // 防止解析失败
+    }
+    if (storageData) {
+      const { value, expire } = storageData;
+      // 在有效期内直接返回
       if (expire === null || expire >= Date.now()) {
         return value as T;
       }
+    }
     removeLocal(key);
+    return null;
   }
   return null;
 }

src/utils/storage/session.ts

@@ -1,14 +1,21 @@
+import { encrypto, decrypto } from '../crypto';
+
 export function setSession(key: string, value: unknown) {
-  const json = JSON.stringify(value);
+  const json = encrypto(value);
   sessionStorage.setItem(key, json);
 }
 
 export function getSession<T>(key: string) {
   const json = sessionStorage.getItem(key);
+  let data: T | null = null;
   if (json) {
-    return JSON.parse(json) as T;
+    try {
+      data = decrypto(json);
+    } catch {
+      // 防止解析失败
     }
-  return null;
+  }
+  return data;
 }
 
 export function removeSession(key: string) {