Crypto加密解密

 

欢迎关注前端早茶，与广东靓仔携手共同进阶

 

 

前端早茶专注前端，一起结伴同行，紧跟业界发展步伐~

 

crypto 模块提供了加密功能，包含对 OpenSSL 的哈希、HMAC、加密、解密、签名、以及验证功能的一整套封装。我们这里讲crypto AES算法加密

一、使用步骤

1.引入Crypto

    1.1   使用Crypto，有两种形式。一种是是在script便签直接引入，例如：

<script src="lib/CryptoJS v3.1.2/rollups/aes.js"></script>

   1.2  还有一种通过npm安装CryptoJS，例如：

npm install crypto-js

    1.2.1  如果是通过npm安装，需要引入，代码如下：

import CryptoJS from 'crypto-js/crypto-js'

2.开始编写逻辑代码

   安装完成后，你根据自己的需求对需要加密的数据进行加密。

二、如何加密

 第一种，先上代码：

    //aes加密
    encrypt (word) {
      const key = CryptoJS.enc.Utf8.parse("1234567890000000"); // 加密秘钥 16位
      const iv = CryptoJS.enc.Utf8.parse("1234567890000000");  // 加密矢量
      let encrypted = '';
      if (typeof(word) == 'string') {
        let srcs = CryptoJS.enc.Utf8.parse(word);
        encrypted = CryptoJS.AES.encrypt(srcs, key, {
          iv: iv,
          mode: CryptoJS.mode.CBC,
          padding: CryptoJS.pad.Pkcs7
        });
      } else if (typeof(word) == 'object') { //对象格式的转成json字符串
        data = JSON.stringify(word);
        let srcs = CryptoJS.enc.Utf8.parse(data);
        encrypted = CryptoJS.AES.encrypt(srcs, key, {
          iv: iv,
          mode: CryptoJS.mode.CBC,
          padding: CryptoJS.pad.Pkcs7
        })
      }
      return encrypted.ciphertext.toString();
    }
  },

代码讲解:

    这里的数据可以用两种数据格式，一种是字符串，一种是对象。然后我们对数据进行处理然后再根据自己定义的秘钥和矢量调用aes算法进行加密。

  第二种，先上代码:

encryption (data) {
    let strs=[];
    for(let i in data){
        strs.push(i+'='+data[i]);
    }
    strs.sort();  // 数组排序
    strs=strs.join('&'); // 数组变字符串
    let endData=strs+'&sign='+CryptoJS.MD5(strs+'ADfj3kcadc2349akvm1CPFFCD84f')
    .toString(); // MD5加密
    let key = CryptoJS.enc.Utf8.parse("0880076B18D7EE81"); // 加密秘钥
    let iv = CryptoJS.enc.Utf8.parse("CB3EC842D7C69578");  //  矢量
    let encryptResult = CryptoJS.AES.encrypt(endData,key, {   //  AES加密
        iv: iv,
        mode: CryptoJS.mode.CBC,
        padding: CryptoJS.pad.Pkcs7  // 后台用的是pad.Pkcs5,前台对应为Pkcs7
    });
    return encodeURIComponent(CryptoJS.enc.Base64.stringify(encryptResult.ciphertext));  // Base64加密再 encode;
}

代码讲解：

    首先我们将数据进行排序，然后将排序好的数据进行MD5加密作为接口的签名，接着将排好序的数据和接口签名拼接上进行AES加密，倒数第二步，将AES加密后的密文进行base64加密，最后将最终的密文encodeURIComponent。

三、如何解密

   1.后台返回的数据也是密文

    2.后台返回的数据是json格式

代码如下：

decryption(data) {
    let key = CryptoJS.enc.Utf8.parse("0880076B18D7EE81");  // 加密秘钥
    let iv = CryptoJS.enc.Utf8.parse("CB3EC842D7C69578");   //  矢量
    let baseResult=CryptoJS.enc.Base64.parse(data);   // Base64解密
    let ciphertext=CryptoJS.enc.Base64.stringify(baseResult);     // Base64解密
    let decryptResult = CryptoJS.AES.decrypt(ciphertext,key, {    //  AES解密
        iv: iv,
        mode: CryptoJS.mode.CBC,
        padding: CryptoJS.pad.Pkcs7
    });
　　// 第一种
    let resData=decryptResult.toString(CryptoJS.enc.Utf8).toString();
    return JSON.parse(resData);
   // 第二种
　　return CryptoJS.enc.Utf8.stringify(decryptResult)
}

 

欢迎关注前端早茶，与广东靓仔携手共同进阶

前端早茶专注前端，一起结伴同行，紧跟业界发展步伐~