vue项目加密之CBC加密

CBC加密

1.添加工具类

import CryptoJS from 'crypto-js'
const keyStrs = 'huayunabcd123456'
const keyIv = 'huayunkjsecurity'
export default {//加密
  encrypt(word){ 
    // cbc加密
    let key = keyStrs;
    let iv = keyIv;
    key = CryptoJS.enc.Utf8.parse(key);
    iv = CryptoJS.enc.Utf8.parse(iv);
    let srcs = CryptoJS.enc.Utf8.parse(word);
    // 加密模式为CBC，补码方式为PKCS5Padding（也就是PKCS7）
    let encrypted = CryptoJS.AES.encrypt(srcs, key, {
            iv: iv,
            mode: CryptoJS.mode.CBC,
            padding: CryptoJS.pad.Pkcs7
    });
    //返回base64
    return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);
  },
  //解密
  decrypt(word){  
       let key = keyStrs;
        let iv = keyIv;
        key = CryptoJS.enc.Utf8.parse(key);
        iv = CryptoJS.enc.Utf8.parse(iv);
        let base64 = CryptoJS.enc.Base64.parse(word);
        let src = CryptoJS.enc.Base64.stringify(base64);
        // 解密模式为CBC，补码方式为PKCS5Padding（也就是PKCS7）
        let decrypt = CryptoJS.AES.decrypt(src, key, {
                iv: iv,
                mode: CryptoJS.mode.CBC,
                padding: CryptoJS.pad.Pkcs7
        });
        let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
        return decryptedStr.toString();
  }
}

2.简单使用

在需要使用加密的页面中调用crypto.js文件
import crypto from '../utils/crypto.js'

完整页面代码（仅供参考）

<template>
  <div></div>
</template>
<script>
import crypto from "../utils/crypto.js";
export default {
  data() {
    return {};
  },
  methods: {
    aes() {
      var a = crypto.encrypt("我进行加密");
      var b = crypto.decrypt(a);
      console.log(a, "加密的密文");
      console.log(b, "解密成功的密文");
    },
  },
  mounted() {
    this.aes();
  },
};
</script>

3.简单效果展示

4. 进阶使用

使用方法跟AES加密一样，只不过是方法类里面的内容改变了而已；
请阅读vue项目加密之AES加密