1.导入crypto-js

导入crypto-js然后，需要设置自己的秘钥

import CryptoJS from 'crypto-js'

// 十六位十六进制数作为密钥
const SECRET_KEY = CryptoJS.enc.Utf8.parse('1234123412341234')
// 十六位十六进制数作为密钥偏移量
const SECRET_IV = CryptoJS.enc.Utf8.parse('1234123412341234')

2.加密

对字符串进行加密

/**
 * 加密方法
 * @param data - 数据
 */
function encrypt(data: string) {
    
    
  const dataHex = CryptoJS.enc.Utf8.parse(data)
  const encrypted = CryptoJS.AES.encrypt(dataHex, SECRET_KEY, {
    
    
    iv: SECRET_IV,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  return encrypted.ciphertext.toString()
}

3.解密

对字符串进行解密

/**
 * 解密方法
 * @param data - 数据
 */
function decrypt(data: string) {
    
    
  const encryptedHexStr = CryptoJS.enc.Hex.parse(data)
  const str = CryptoJS.enc.Base64.stringify(encryptedHexStr)
  const decrypt = CryptoJS.AES.decrypt(str, SECRET_KEY, {
    
    
    iv: SECRET_IV,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  const decryptedStr = decrypt.toString(CryptoJS.enc.Utf8)
  return decryptedStr.toString()
}

4. 搭配localStorage使用

从localStorage读取数据

/**
 * 从localStorage读取数据
 * @param dataName - localStorage中key值
 */
const getData = (dataName: string) => {
    
    
  try {
    
    
    const rlt = localStorage.getItem(dataName)
    if (rlt === null) return null
    return decrypt(rlt)
  } catch (err) {
    
    
    throw new Error('localStorage数据获取错误')
  }
}

存数据至localStorage

/**
 * 存数据至localStorage
 * @param dataName - localStorage中key值
 * @param text - 存储的数据
 */
const setData = async (dataName: string, text: string) => {
    
    
  localStorage.setItem(dataName, encrypt(text))
}