前端加密
本文深入解析前端加密技术实现方案，详细比较AES、DES等对称加密算法特性及适用场景。通过CryptoJS库实战演示加密流程，涵盖密钥处理、加密模式选择及数据填充方案，提供完整的加密解密函数实现。文章还解析流加密与块加密的核心差异，帮助开发者构建安全可靠的前端数据加密方案。
crypto-js
CryptoJS 是一个用于加密和解密的 JavaScript 库。它提供了常见的加密算法，如AES、DES、Triple DES、RC4、Rabbit等，以及常见的哈希函数，如MD5、SHA-1、SHA-256等。CryptoJS 的目标是在浏览器环境中提供安全且易于使用的加密实现。
加密算法
| 算法 | 类型 | 密钥长度 | 特点 |
|---|---|---|---|
| AES (Advanced Encryption Standard) | 对称加密算法 | 128位、192位、256位 | 目前最广泛使用的对称加密算法之一，提供较高的安全性和性能。在许多安全协议和应用中得到广泛应用，如TLS/SSL、VPN等。 |
| DES (Data Encryption Standard) | 对称加密算法 | 56位 | 最早的对称加密算法之一，由于密钥长度较短，易受暴力破解攻击。在实际应用中，DES逐渐被更安全的算法取代。 |
| Triple DES (3DES or TDEA) | 对称加密算法 | 112位或168位 | 通过多次应用DES算法来增加密钥长度，提高安全性。相对于原始DES更安全，但性能较低，在一些场景中可能被更先进的算法取代。 |
| RC4 | 流加密算法 | 可变 | 以简单性和高效性而闻名，曾常用于加密通信协议，如TLS/SSL。由于存在安全性漏洞和攻击，RC4已不再被推荐使用。 |
| Rabbit | 流加密算法 | 128位 | 一种较新且安全性较高的流加密算法，具有较快的加密速度。设计用于抵抗各种已知的密码分析攻击，并在某些应用中被广泛采用。 |
加密类型
| 属性 | 流加密算法 | 对称加密算法 | 非对称加密算法 |
|---|---|---|---|
| 类型 | 对称加密算法 | 对称加密算法 | 非对称加密算法 |
| 工作原理 | 逐比特（或逐字节）地处理数据流 | 使用相同密钥加密和解密 | 使用一对密钥加密和解密 |
| 密钥管理 | 相同的密钥用于加密和解密 | 同一密钥用于加密和解密 | 一对密钥，公钥和私钥 |
| 速度 | 通常较快 | 通常较快 | 通常较慢 |
| 适用场景 | 实时通信、数据流传输 | 大量数据加密 | 密钥交换、数字签名、通信 |
| 典型算法示例 | RC4, Salsa20 | AES, DES, 3DES | RSA, ECC |
例子
引入crypto-js
shell
npm install crypto-js加密
ts
const handleEncrypt = (str, keyStr) => {
try {
if (!str) return '';
// 将密钥转换为Utf8编码
const key = CryptoJS.enc.Utf8.parse(keyStr);
// 不使用偏移量（Initialization Vector，IV）
const iv = CryptoJS.enc.Utf8.parse('');
// 将要加密的字符串转换为Utf8编码
const srcs = CryptoJS.enc.Utf8.parse(str);
// 使用AES算法进行加密
const encrypted = CryptoJS.AES.encrypt(srcs, key, {
iv: iv, // 指定IV
mode: CryptoJS.mode.CBC, // 使用CBC模式
padding: CryptoJS.pad.Pkcs7, // 使用PKCS7填充
});
// 将加密后的数据转换成Base64格式
return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);
} catch (error) {
console.error('加密错误:', error);
return '';
}
};解密
ts
export function Decrypt(word, key, iv) {
key = CryptoJS.enc.Utf8.parse(key);
iv = CryptoJS.enc.Utf8.parse(iv);
let base64 = CryptoJS.enc.Base64.parse(word);
let src = CryptoJS.enc.Base64.stringify(base64);
let decrypt = CryptoJS.AES.decrypt(src, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
return decryptedStr.toString();
}