[JavaScript知识库]CryptoJS 加密算法类库

crypto-js 是谷歌开发的一个纯 JavaScript 加密算法类库。常用的加密方式有 MD5 和 AES。使用时可以引用总文件，也可以单独引用某一文件。

• iv 是密钥偏移量，这个一般是接口返回的，或者前后端协定一致。
• key（密钥） 和 iv（偏移量） 都可以更换，但是需要保证的是加解密的 key 和 iv 保持一致。

对象或数组需要转换成字符串 JSON.stringify() 进行加密；加密后的数组或对象需要使用 JSON.parse() 进行解密。

CryptoJS 安装

安装依赖：npm install crypto-js

模板中导入：import CryptoJS from 'crypto-js'

MD5 加密，Base64 加密

// MD5 加密完成后需要把它加密成 Base64 位的字符串
const password = CryptoJS.enc.Base64.stringify(CryptoJS.MD5('A012345'));
console.log('MD5加密', CryptoJS.MD5('12345'))
console.log('Base64加密', password)

Base64 加解密

// 加密写法1
var utf8Str = CryptoJS.enc.Utf8.parse("待加密字符串")
CryptoJS.enc.Base64.stringify(utf8Str)

// 加密写法2
CryptoJS.enc.Utf8.parse("待加密字符串").toString(CryptoJS.enc.Base64)

// 解密
CryptoJS.enc.Base64.parse("带解密").toString(CryptoJS.enc.Utf8)

/**
  CryptoJS.enc.Base64.stringify("字符串") 和  
  "字符串".toString(CryptoJS.enc.Base64) 是相同的含义
*/

?AES 加解密?

// 加密
CryptoJS.AES.encrypt('待加密字符串', '秘钥').toString()

// 解密
CryptoJS.AES.decrypt('待解密字符串', '秘钥').toString(CryptoJS.enc.Utf8)

文本加解密

// encrypt
var ciphertext = CryptoJS.AES.encrypt('my message', 'secret key').toString()
 
// decrypt
var bytes = CryptoJS.AES.decrypt(ciphertext, 'secret key')
var plaintext = bytes.toString(CryptoJS.enc.Utf8)
 
console.log(plaintext);

对象加解密

const data = [{id: 1}, {id: 2}]
 
// Encrypt
const ciphertext = CryptoJS.AES.encrypt(
  JSON.stringify(data), 'secret key'
).toString();
 
// Decrypt
const bytes  = CryptoJS.AES.decrypt(ciphertext, 'secret key');
const decryptedData = JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
 
console.log(decryptedData);

?自定义加解密函数

const key = CryptoJS.enc.Base64.parse("秘钥") // 这里使用 base64 或 utf8 要看要求，加解密一致即可
const iv = CryptoJS.enc.Utf8.parse('偏移量') // 十六位十六进制数作为密钥偏移量

// 加密 1
function Encrypt(word) {
  let srcs = CryptoJS.enc.Utf8.parse(word)
  let encrypted = CryptoJS.AES.encrypt(srcs, key, { 
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  return encrypted.toString()
}

// 解密 1
function Decrypt(word) {
  let decrypt = CryptoJS.AES.decrypt(word, key, { 
    iv: iv, 
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8)
  return decryptedStr.toString()
}


// 加密 2
function Encrypt(word) {
  let srcs = CryptoJS.enc.Utf8.parse(word)
  let encrypted = CryptoJS.AES.encrypt(srcs, key, { 
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7 
  })
  return encrypted.ciphertext.toString()
}

// 解密 2
function Decrypt(word) {
  let encryptedHexStr = CryptoJS.enc.Hex.parse(word)
  let srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr)
  let decrypt = CryptoJS.AES.decrypt(srcs, key, { 
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  })
  let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8)
  return decryptedStr.toString()
}

<template>
  <section style="width: 600px; margin: 0 auto;">
    <el-row>
      <el-col :span="10">
        <el-row>
          <el-col :span="24">明文内容</el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-input v-model="content" type="textarea" :rows="8"></el-input>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="4">
        <div style="margin-top: 60px;">
          <el-row style="margin-bottom: 10px;">
            <el-col :span="24">
              <el-button type="primary" @click="encryptFunction">加密</el-button>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-button type="primary" @click="unEncryptFunction">解密</el-button>
            </el-col>
          </el-row>
        </div>
      </el-col>
      <el-col :span="10">
        <el-row>
          <el-col :span="24">密文内容</el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-input v-model="encryptContent" type="textarea" :rows="8"></el-input>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
  </section>
</template>
<script>
  import  CryptoJS from 'crypto-js'
  export default {
    data() {
      return {
        content: null,
        encryptContent: null, // 加密内容
        encryptSecretKey: null // 加密密钥
      }
    },
    methods: {
      /**
       * 加密方法
       **/
      encryptFunction: function () {
        this.$data.encryptSecretKey = null;
        let objEncrypt = null;
        objEncrypt = this.encryptByAES(this.$data.content);
        if (objEncrypt) {
          this.$data.encryptContent = objEncrypt.encryptContent;
          this.$data.encryptSecretKey = objEncrypt.encryptSecretKey;
        }
      },
      /**
       * aes加密
       * @param strEncrypt:需要加密的内容
       * @return 返回加密后的内容与加密密钥
       **/
      encryptByAES: function (strEncrypt) {
        let aesSecretKey = ''; // 16长度随机字符串
        do {
          // NumberObject.toString(36) 代表36进制，string.substr(2) 下标为2的位置开始截取，Math.random() 返回0~1之间的随机数包含0
          aesSecretKey = Math.random().toString(36).substr(2) + Math.random().toString(36).substr(Math.floor(Math.random() * (12 - 5 + 1) + 5))
        } while (aesSecretKey.length != 16);
        let aesSecretUtf8 = CryptoJS.enc.Utf8.parse(aesSecretKey);
        const iv = CryptoJS.enc.Base64.parse('******KKKKKKKKKKKKKKKKK******'); // iv偏移量，加密解密偏移量需要一致
        console.log('iv', iv)
        let aesEncrypt = CryptoJS.AES.encrypt(strEncrypt, aesSecretUtf8, {
          iv: iv,
          mode: CryptoJS.mode.CBC, // 模式
          padding: CryptoJS.pad.Pkcs7 // 补码方式
        });
        let objReturn = {
          encryptContent: aesEncrypt.toString(),
          encryptSecretKey: aesSecretKey
        };
        return objReturn;
      },
      /**
       * 解密方法
       **/
      unEncryptFunction: function () {
        this.$data.content = this.unEncryptByAES( this.$data.encryptContent, this.$data.encryptSecretKey)
      },
      /**
       * aes加密
       * @param strEncrypt:需要解密的内容
       * @param keyEncrypt:加密时用到的密钥
       * @return 返回解密后的内容
       **/
      unEncryptByAES: function (strEncrypt,keyEncrypt) {
        let aesSecretUtf8 = CryptoJS.enc.Utf8.parse(keyEncrypt);
        const iv = CryptoJS.enc.Base64.parse('******KKKKKKKKKKKKKKKKK******');
        let aesUnEncrypt = CryptoJS.AES.decrypt(strEncrypt, aesSecretUtf8,
          {
            iv: iv,
            mode: CryptoJS.mode.CBC,
            padding: CryptoJS.pad.Pkcs7
          });
        return aesUnEncrypt.toString(CryptoJS.enc.Utf8);
      },
    },    
  }
</script>