前端JS最简单的方式实现AES加解密，使用crypto-js，适用于vue、react等框架

作者：
技术笔记
发布：2021年5月14日 23:57
367 人已阅读

简介前端加密虽然在某种意义上形同虚设，破解只是时间问题，但是为了增加破解成本和配合后端加密需求，有时候还是不得不用的。前端实现加解密，最好用的库 crypto-js 使用简单，功能强大，可以配合各种前端框架。

不得不说 crypto-js 确实一个很好的库，用起来简单快捷，把使用方法记录一下，便于项目中用到的时候再查资料。

普通网页JS中使用，直接引入就可以了

<script src="https://cdn.staticfile.org/crypto-js/4.0.0/crypto-js.min.js" type="text/javascript"></script>

vue、react 等框架引入

npm install crypto-js
// 或者
yarn add crypto-js

加密：

let data = CryptoJS.enc.Utf8.parse(data);
let key = CryptoJS.enc.Utf8.parse(secret_key);
let iv = CryptoJS.enc.Utf8.parse(iv);
CryptoJS.AES.encrypt(data, key, {
            iv: iv,
            mode: CryptoJS.mode.CBC,
            padding: CryptoJS.pad.Pkcs7
        }).toString();

解密：

let text = CryptoJS.enc.Utf8.parse(text);
let key = CryptoJS.enc.Utf8.parse(secret_key);
let iv = CryptoJS.enc.Utf8.parse(iv);
CryptoJS.AES.decrypt(text, parse(secret_key),{
            iv: iv,
            mode: CryptoJS.mode.CBC,
            padding: CryptoJS.pad.Pkcs7
        }).toString(CryptoJS.enc.Utf8);