前端加密方案对接实践

#需求背景：

查询对接第三方团队获取用户个人信息的接口，涉及到敏感数据的传输，例如：姓名、手机号、身份证等信息，此过程需要加密处理。

#入参需加密字段：姓名、手机号、证件号

第三方团队提供的接口是公共接口且使用 AES 对称加密(BLD-AES-Key)，仅用于我们自己的后台服务 与 第三方团队的后台服务之间的数据安全加密传输

#安全加密方案

基于以上情况，当前的后台服务与第三方服务之间已经建立AES加密方案，但是前端与当前的服后台务之间的数据传输也是需要加密处理的。安全传输有以下两种方案

#1. 方案一（对称加密方案）：

1. 每次接口请求前，前端与当前后台服务商定，以统一的方法生成一次性 AES 或 DES 密钥 key（One-Time-Key），使用 SHA1(SessionID + Timestamp + Salt)的方式作为 AES Key 的偏移量 iv，其中 salt 也是前后端商议好的固定值

2. 当前后台服务使用相同的密钥 key和 偏移量 iv解密，在与第三方的团队的服务走加密方式调用接口

3. 接口结果返回

One-Time-Key 生命周期只在当前会话中，用完即弃；可以自己定义生成一个类似uuid的规则；

#对称加密代码实现

复制import JSEncrypt from 'jsencrypt';

export function generateRandom16UUID() {
  let codeArr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
  let res = '';
  for (let i = 0; i < 16; i++) {
    const id = Math.ceil(Math.random() * 61);
    res += codeArr[id];
  }
  return res;
}


 * aes加密方案：key + iv偏移量
 * 1.定义key: xQMNYmKhNuqQ4aAIta
 * 2.使用SHA1(SessionID+Timestamp+Salt)的方式作为偏移量 salt: xQYTRmKhNuqQ4aAIta
 */
export function encrypteData(content, deviceId, timestamp) {
  const keyStr = generateRandom16UUID();
  const saltStr = 'xQYTRmKhNuqQ4aAIta';
  const ivStr = CryptoJS.SHA1(deviceId+timestamp+saltStr).toString().substring(0, 16);
  
  const key = CryptoJS.enc.Utf8.parse(keyStr);
  const iv = CryptoJS.enc.Utf8.parse(ivStr);

  const encrypt = CryptoJS.AES.encrypt(content, key, {
    iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  return encrypt.ciphertext.toString();
}

对称加密需要给后端透传 key，通过前端源码反编译是很容易拿到加密方案，故该加密方式容易被破解

#2. 方案二（对称加密 + 非对称加密方案）：

1. 服务提前配置一个 RSA 密钥对(Key-Pair)，并将 Public Key 公钥告知前端，前端应用内置在其代码文件中

2. 每次接口请求前，前端生成一个一次性的 AES 或 DES 密钥key(One-Time-Key)，用于加密需保护的字段，再使用内置的 Public Key 加密该对称密钥生成 Encrypted-Key，附带业务数据传给当前的后台服务

3. 当前的后台服务使用 RSA 私钥 Private Key 将 Encrypted-Key 解密，获得key（One-Time-Key），从而将加密字段解密，获取字段的明文

4. 当前的后台服务服务使用 BLD-AES-Key 加密需要保密的字段，随后与第三方的团队的服务走加密方式调用接口

5. 接口结果返回，使用 BLD-AES-Key 解密保密字段，再使用key（One-Time-Key）重新加密，返回给前端

由于 One-Time-Key 只存在于每次的请求会话中，且被 RSA 密钥保护，几乎没有泄露的风险；字段明文也只会出现在当前后台服务内存中，安全可控； 注意：日志中不能包含相关敏感字段, 并且该方案的可能会引起性能上的下降

#对称加密 + 非对称加密的代码实现

复制import JSEncrypt from 'jsencrypt';

const publicKeyDev = `-----BEGIN PUBLIC KEY-----
MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA5/qTnvd5gKfk5u6mQW8b
UNjrS4cCy8kVQRd+3bimIXSXDkH34y0BEmOgNCavToeSEIeLUtz+hqz4tw+5UIU3
W64sy6c+klXEH6aNW+1jkHkeYMXtIRvjem6UDiZDEcCF9aX6h6nUDaEWKnQw9OvD
i6J5Srp9tDlXysrtywLIGKCvd7VRUGD/IxyMz/qlZUyjM175VMXmhTpG2palLBMU
RGVxbKvaw2udcUf1OSrSqRAk+odFB6Hhx2quxm64nq0lLpq9x9Yl5qkNqi02V3Tj
CDSw1gcjI2X3HHVPefTXUziNfk8PHHwgxDzk24jUMsz4sl4J3Ut1xVWPEuY5hvl7
4wIDAQAB
-----END PUBLIC KEY-----`;

const publicKeyProd = `-----BEGIN PUBLIC KEY-----
MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA6aLR6OlZj7YnXLEgZVX9
vkvHmvN3HUEQ80iKJ69D4/0buq/1/9fWcUy3hUntQxGEYEoChJjAFZH53Ov8v/Xs
MZOdjgdb+EpC1KbE62Eh+StbdmayektQ5zatZxTiEzPsRCeuyl51c1Rbf8IiQzOW
thYdYpvufpC8PZgN2+1HNGvgeXm9FEQEt4nPoJink/oNtsiE+bDfs7TAYcHYN9fP
78roh6fp1x55ZsLw1kw+OUbpFkT8j5MzZHAKxrTZVhIFsSefI5+x9FksAuFe2Oyz
g5Y5uPvU0yZX5gm9AeuE/AWmEODKSd1LbwGE4KwFqEkX/Or1cu83x42xoSGKgsKG
mwIDAQAB
-----END PUBLIC KEY-----`

function getPublicKey() {
  return window._TARGET === 'prd' ? publicKeyProd : publicKeyDev;
}


 * aes 加密方式
 * @param {*} content 加密的内容
 * @param {*} deviceId 设备id
 * @param {*} timestamp 时间戳
 * @param {*} aesKey 生成的随机uuid作为aes 加密的key
 * @returns 
 */
export function encrypteData(content, deviceId, timestamp, aesKey) {
  const keyStr = aesKey;
  const ivStr = CryptoJS.SHA1(deviceId + timestamp).toString().substring(0, 16);

  const key = CryptoJS.enc.Utf8.parse(keyStr);
  const iv = CryptoJS.enc.Utf8.parse(ivStr);

  const encrypt = CryptoJS.AES.encrypt(content, key, {
    iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  return encrypt.ciphertext.toString();
}


 * rsa对带过来的 key加密
 * @param {*} aesKey 生成的随机uuid作为aes 加密的key
 * @returns 
 */
export const setRsaCode = function (aesKey) {
  const jsencrypt = new JSEncrypt();
  const publicKey = getPublicKey();
  jsencrypt.setPublicKey(publicKey)
  const result = jsencrypt.encrypt(aesKey);
  return result;
};

export function generateRandom16UUID() {
  let codeArr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
  let res = '';
  for (let i = 0; i < 16; i++) {
    const id = Math.ceil(Math.random() * 61);
    res += codeArr[id];
  }
  return res;
}