记一次前后端加密

要求

1、加密使用AES/ECB/PKCS5Padding算法，256位，密钥为XXXXX
2、加密解密后使用Base64进行编解码

2.WordArray (An array of 32-bit words.)

使用AES加密前，先了解下WordArray，我把它理解成CryptoJS中定义的 新的 数据类型，叫“单词数组”。

2.1 ： 初始化

var wordArray = CryptoJS.lib.WordArray.create();//创建一个空的 WordArray对象

2.2 ： WordArray 对象 —>16进制字符串

1. var string = wordArray.toString();//默认CryptoJS.enc.Hex，即16进制字符串

2. var string = wordArray.toString(CryptoJS.enc.Utf8);//utf-8字符串

2.3 ： 16进制字符串 —>WordArray对象

var wordArray = CryptoJS.enc.Hex.parse(hexString);

2.4 ： WordArray对象—>utf8字符串

1. var utf8String = CryptoJS.enc.Utf8.stringify(wordArray);

2. //等价于2.2中 wordArray.toString(CryptoJS.enc.Utf8);

2.5 ： utf8字符串—>WordArray对象

 var wordArray = CryptoJS.enc.Utf8.parse(utf8String);

2.6 ： WordArray对象—>Base64字符串

var base64String = CryptoJS.enc.Base64.stringify(wordArray);

2.7 ： Base64字符串—>WordArray对象

var wordArray = CryptoJS.enc.Base64.parse(base64String);

AES加密函数 返回值为 加密对象ciphertext，其属性： 
* ciphertext: ciphertextWordArray, 
* key: keyWordArray, 
* iv: ivWordArray, CBC需要
* algorithm: CryptoJS.algo.AES, 
* mode: CryptoJS.mode.CBC, 
* padding: CryptoJS.pad.PKCS7, 
* blockSize: 4, 
* formatter: CryptoJS.format.OpenSSL

属性ciphertext即 密文，可以发现，其为WordArray类型。通过 加密对象.属性名 取值。

function aesEncrypt(message,key,iv){
    var ciphertext = CryptoJS.AES.encrypt(message, key, {   
        iv: CryptoJS.enc.Hex.parse(iv),
        mode: CryptoJS.mode.CBC,
        padding:CryptoJS.pad.Pkcs7 
    });
    return CryptoJS.enc.Base64.stringify(ciphertext.ciphertext);//密文 转 Base64字符串
}
 
//解密函数 稍有改动。
function aesDecrypt(crypted,key,iv){
    var decrypted = CryptoJS.AES.decrypt({ciphertext: CryptoJS.enc.Base64.parse(crypted)},key,{ 
        iv: CryptoJS.enc.Hex.parse(iv),
        mode: CryptoJS.mode.CBC,
        padding:CryptoJS.pad.Pkcs7 
    });
    return decrypted.toString(CryptoJS.enc.Utf8);
}

我的加密：

处理密钥

// 密钥都是字节数组的，无法用字符串直接表示，为了方便存储所以就转base64编码，这里是base64编码密钥转字节数组
var key2 = CryptoJS.enc.Base64.parse(
  'CAMG8sIUINKJSDSD+5LDxKdsae3kATY8='
)

// 加密，解密
  encrypt(value) {
    const ciphertext = CryptoJS.AES.encrypt(value, key2, {
      mode: CryptoJS.mode.ECB,
      padding: CryptoJS.pad.Pkcs7,
    })
    //说什么toString()可以转成base64,应该是不行的，需要用下面这种
    return CryptoJS.enc.Base64.stringify(ciphertext.ciphertext)
    // window.atob(res.ciphertext)
  },
  decrypt(value) {
    return CryptoJS.AES.decrypt(value, key2, {
      mode: CryptoJS.mode.ECB,
      padding: CryptoJS.pad.Pkcs7,
    }).toString(CryptoJS.enc.Utf8)
  },

然后在axios的拦截器中

请求拦截中做了判断之后

传的内容需要是字节数组或字符串
config.data = { data: utils.encrypt(JSON.stringify(config.data)) }

响应拦截中做了判断之后用JSON.stringify解析下

const ret = utils.decrypt(res.data.data)
      // JSON.parse出对象
res.data = JSON.parse(ret)

参考：

CryptoJS中AES256(CBC)加密算法简单使用_小飞侠-2的博客-CSDN博客

https://blog.csdn.net/qq_26562641/article/details/75309222

https://www.jb51.net/article/258336.htm

前端实现base64编码和解码_bigHead-的博客-CSDN博客_前端base64

前端加密JS库--CryptoJS 使用指南 - 走看看

encodeURI和encodeURIComponent的区别

https://www.jianshu.com/p/b72344249b51

前端加密JS库--CryptoJS 使用指南 - 走看看