Vue前端使用加密秘钥和AES进行加密

Vue前端使用加密秘钥和AES进行加密

安全需求：登录密码在登录接口post时是明文的，需要前端进行加密后连同用户名和图形验证码传输给后台。

1. 安装crypto-js

 npm install crypto-js --save

2.  在工具类中写入如下方法 import CryptoJS from 'crypto-js' // 引入 // 加密 export function encrypt(word, keyStr){ keyStr = keyStr || 'abcdefghijk12345'; // 加密秘钥不存在，则默认一个 var key = CryptoJS.enc.Utf8.parse(keyStr); var srcs = CryptoJS.enc.Utf8.parse(word); var encrypted = CryptoJS.AES.encrypt(srcs, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}); return encrypted.toString(); }, //解密 export function decrypt(word, keyStr){ keyStr = keyStr || 'abcdefghijk12345'; var key = CryptoJS.enc.Utf8.parse(keyStr); var decrypt = CryptoJS.AES.decrypt(word, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}); return CryptoJS.enc.Utf8.stringify(decrypt).toString(); }

1、两个方法中第一个参数是待加密或待解密字符串，第二个参数是从后端请求过来的aes加密需要用到的16位字符串的key；

2、如果想对一个js对象加密，需要先把该对象转成json字符串

3. 在需要使用加密或解密方法的页面中引入utils文件就可以了