目录
一、介绍
前端作用
后端作用
二、vue种实现、使用
三、封装 加密、解密 工具方法
一、介绍
AES（Advanced Encryption Standard）加密，即高级加密标准，是一种广泛使用的对称密钥加密算法，用于加密和解密数据。以下是对AES加密的详细介绍，以及其在前端和后端中的作用。
AES经过长时间的研究和测试，被认为是目前最安全的加密算法之一。
前端作用
保护敏感数据：在前端，AES加密可用于保护用户输入的敏感数据，如登录密码、个人身份信息、支付信息等，在传输到服务器之前进行加密，防止数据在传输过程中被截获或窃取。提升用户体验：通过前端加密，可以在一定程度上减少用户对于数据安全的担忧，提升用户体验。同时，前端加密也可以减少服务器端的处理负担，因为服务器无需再对传输的数据进行额外的加密处理。配合后端验证：前端加密通常与后端解密配合使用，前端加密后的数据需要在后端进行解密和验证，以确保数据的完整性和安全性。
后端作用
数据存储安全：在后端，AES加密可用于保护存储在数据库或其他存储介质中的敏感数据。通过加密存储，即使数据库被非法访问，攻击者也无法直接获取到明文数据。防止数据泄露：后端加密是防止数据泄露的重要手段之一。通过加密处理，可以确保即使数据在传输过程中被截获，攻击者也无法直接获取到有价值的信息。与其他安全措施配合：后端加密通常需要与其他安全措施配合使用，如访问控制、数据备份、安全审计等，以形成完整的数据安全保护体系。
二、vue种实现、使用
在Vue项目中使用AES加密解密，需要先安装crypto-js库。
pnpm 或者 npm
pnpm install crypto-jsnpm install crypto-js
三、封装 加密、解密 工具方法
AES加密 有两种 模式 ---- ECB模式 和 CBC模式
ECB（电子密码本模式）是一种简单的加密方式，将数据分成固定长度的块进行加密。以下是ECB模式的加密和解密方法
CBC（密码块链接模式）通过使用前一个块的加密结果来影响当前块的加密过程，从而提高安全性。
这里作者 只 对 ECB 模式 进行举例介绍
封装两个函数，分别为加密和解密。我们从 crypto-js库。里面引入 CryptoJS 这个对象。然后使用上面的方法。
网上的文章在使用时有很多种格式，经过作者实践，大部分都是错的，会造成加密失败和无法解密。根据测试，作者下面这种写法较为可靠。
还有一点非常重要，大家要注意公钥的保存，因为前后端我们使用公钥进行加密解密，公钥在保存上的安全性直接决定了加密的安全性。如果公钥被窃取加密就形同虚设了。我目前是放在了环境变量里面，因为环境变量文件里面的数据不会被保留成静态文件。
import CryptoJS from 'crypto-js'/** * aes 解密 * @param {string} text 需要解密的字符串 * @returns {string} */export function Decrypt(text) { let key = import.meta.env.VITE_SECRET_KEY; //公钥 vite格式环境变量，请根据需要更改 let decrypt = CryptoJS.AES.decrypt({ ciphertext: CryptoJS.enc.Base64.parse(text) }, CryptoJS.enc.Utf8.parse(key), { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7, }); return decrypt.toString(CryptoJS.enc.Utf8)}/** * aes 加密 * @param {string} text 需要加密的字符串 * @returns {string} */export function Encrypt(text) { let key = import.meta.env.VITE_SECRET_KEY; //公钥 vite格式环境变量，请根据需要更改 let encrypt = CryptoJS.AES.encrypt(text, CryptoJS.enc.Utf8.parse(key), { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 }); return encrypt.toString()}