安装依赖

npm install crypto-js --save-dev

在公共文件夹里创建一个js文件，将对称加密与对称解密方法封装一下

AesEncryptUtil.js

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

/**
 * AES加密 ：字符串 key iv  返回base64
 */
export function Encrypt(word, keyStr) {
    let key,iv,ivStr;
    if (!keyStr) {
        throw new Error("keyStr 不能为空");
    }
    ivStr = 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.CBC,
        padding: CryptoJS.pad.ZeroPadding
    });
    // console.log("-=-=-=-", encrypted.ciphertext)
    return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);

}
/**
 * AES 解密 ：字符串 key iv  返回base64
 */
export function Decrypt(word, keyStr) {

    let key,iv,ivStr;
    if (!keyStr) {
        throw new Error("keyStr 不能为空");
    }
    ivStr = 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.CBC,
        padding: CryptoJS.pad.ZeroPadding
    });

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

login.vue(部分代码)

 <script>
 import {Encrypt} from "../public/AesEncryptUtil"//地址根据自己的项目修改
 export default {
 methods:{
  login(){
   let key='key-value0123456';//密钥值随意定义，和后端商议保持一致
   let loginMsg={
    username:this.loginForm.username,
    password:Encrypt(that.loginForm.password,key),//对密码进行AES加密
   }
    //调用后端接口将loginMsg传入后台
    ...
  }
 }
 }
 </script>