媒介

因公司现有背景治理体系项目需对部份收集要求接口的主要数据举行加密，整合了一套简朴的基于 RSA + AES 加密机制的前端解决方案。

参考文献：

1. crypto 廖雪峰
2. crypto-js aes 加解密
3. rsa 加解密

参考 API：

1. crypto-js
2. JSEncrypt

依靠

1. crypto-js： npm i crypto-js
2. JSEncrypt：npm i jsencrypt

加密流程

先上图

因项目为背景治理体系，所以这里会有两种营业场景：

1. 用户在未登录前是没有鉴权 token 的，需在胜利登录并猎取 token 后和 encryptKey 一并上传后端，后端才能将 token 与 encryptKey 做绑定。
2. 用户已登录胜利，页面革新后将会从新天生 aesKey ，这时候需从 cookie 中猎取 token 并和 encryptKey 上传后端，后端从新绑定 token 和 encryptKey。

代码

encryption.js 封装

import CryptoJS from 'crypto-js'
import JSEncrypt from 'jsencrypt'

const encryptor = new JSEncrypt()

// 天生 AESKEY
export const aesKey = createAesKey()

export function createAesKey () {
  const expect = 16
  let str = Math.random().toString(36).substr(2)
  while (str.length < expect) {
    str += Math.random().toString(36).substr(2)
  }
  str = str.substr(0, 16)
  return str
}

/**
 * AES 加密
 * @param word 待加密字段
 * @param keyStr 加密 key
 * @returns {string} 返回加密字段
 */
export function aesEncrypt (word, keyStr) {
  keyStr = keyStr || aesKey
  console.log(keyStr)
  const key = CryptoJS.enc.Utf8.parse(keyStr)
  let srcs = ''
  switch (typeof (word)) {
    case 'string':
      srcs = CryptoJS.enc.Utf8.parse(word)
      break
    case 'object':
      srcs = CryptoJS.enc.Utf8.parse(JSON.stringify(word))
      break
    default:
      srcs = CryptoJS.enc.Utf8.parse(word.toString())
  }
  const encrypted = CryptoJS.AES.encrypt(srcs, key, {iv: key, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7})
  return encrypted.toString()
}

/**
 * AES 解密
 * @param word 待解密数据
 * @param keyStr 解密 key
 * @returns {string} 返回解密字符串
 */
export function aesDecrypt (word, keyStr) {
  keyStr = keyStr || aesKey
  const key = CryptoJS.enc.Utf8.parse(keyStr)
  const decrypt = CryptoJS.AES.decrypt(word, key, { iv: key, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 })
  return CryptoJS.enc.Utf8.stringify(decrypt).toString()
}

/**
 * RSA 设置公钥
 * @param val 公钥
 */
export function setPublicKey (val) {
  encryptor.setPublicKey(val)
}

/**
 * RSA 加密
 * @param data 待加密数据
 * @returns {PromiseLike<ArrayBuffer>} 返回加密字符串
 */
export function rsaEncrypt (data) {
  return encryptor.encrypt(data)
}

总结

AES 加解密涉及到的形式（如 CBC、ECB 等）、偏移量和添补等，请参考文中媒介说起的文献和 API

本文仅为解决方案参考，请结合实际营业需求及营业场景自由发挥