vue中使用AES加密

先安装

npm install crypto-js --save-dev

在项目中新建一个utils.js文件

我建在 src/assets/js/utils.js

utils.js文件中的内容

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

// 默认的 KEY 与 iv 如果没有给
const KEY = CryptoJS.enc.Utf8.parse("123");//""中与后台一样  密码
const IV = CryptoJS.enc.Utf8.parse();//""中与后台一样

/**
 * AES加密 ：字符串 key iv  返回base64
 */
export function Encrypt(word, keyStr, ivStr) {
    let key = KEY
    let iv = IV

    if (keyStr) {
        key = CryptoJS.enc.Utf8.parse(keyStr);
        iv = CryptoJS.enc.Utf8.parse(ivStr);
    }

    let srcs = CryptoJS.enc.Utf8.parse(word);
    var encrypted = CryptoJS.AES.encrypt(srcs, key, {
        iv: iv,
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
    });
    // console.log("-=-=-=-", encrypted.ciphertext)
    return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);
}

/**
 * AES 解密 ：字符串 key iv  返回base64
 *
 */
export function Decrypt(word, keyStr, ivStr) {
    let key = KEY
    let iv = IV

    if (keyStr) {
        key = CryptoJS.enc.Utf8.parse(keyStr);
        iv = CryptoJS.enc.Utf8.parse(ivStr);
    }

    let base64 = CryptoJS.enc.Base64.parse(word);
    let src = CryptoJS.enc.Base64.stringify(base64);

    var decrypt = CryptoJS.AES.decrypt(src, key, {
        iv: iv,
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
    });

    var decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
    return decryptedStr.toString();
}

在需要使用加密解密方法的vue组件中使用import引入utils.js文件即可使用了

import {Decrypt,Encrypt} from '@/assets/js/utils.js'

// Encrypt 加密
let a = Eecrypt(a);
console.log(a);
// Decrypt 解密
let a = Decrypt(a);
console.log(a);

举个栗子吧：

//get请求---“messageStr”是前后端约定好的
API({params{"messageStr":Encrypt(JSON.stringify({'id':id}))}}).then(res => {
    if (res.data.success === true) {
        this.$Message.success(res.data.message);
    } else {
        this.$Message.error('失败，服务器出错了，再试一次吧！');
    }
        this.listData(1);
    }).catch(res => {
        console.log(res)
    });