前端常用加密方案：Base64、MD5、AES 与 RSA 实战

AES 对称加密

AES 是高级加密标准，加解密使用同一把密钥。它的速度很快，适合处理大量数据。不过，密钥管理是关键，一旦泄露，所有数据都将暴露。

在实际应用中，为了增强安全性，通常会结合随机向量（IV）使用 CBC 模式，而不是简单的 ECB 模式。下面是一个基于 CryptoJS 的基础实现示例：

import CryptoJS from 'crypto-js';

function aesEncrypt(data, key) {
  const keyHex = CryptoJS.enc.Utf8.parse(key);
  const encrypted = CryptoJS.AES.encrypt(data, keyHex, {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
  });
  return encrypted.toString();
}

function aesDecrypt(encryptedData, key) {
  const keyHex = CryptoJS.enc.Utf8.parse(key);
  const decrypted = CryptoJS.AES.decrypt(encryptedData, keyHex, {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
  });
  return decrypted.toString(CryptoJS.enc.Utf8);
}

// 注意：生产环境建议使用 CBC 模式并传入 IV
const key = "1234567890123456"; // 必须为 16/24/32 位
const originalText = "Hello, World!";
const encryptedText = aesEncrypt(originalText, key);
const decryptedText = aesDecrypt(encryptedText, key);

RSA 非对称加密

RSA 使用一对密钥：公钥加密，私钥解密。公钥可以公开，私钥必须严格保密。它常用于密钥交换或身份认证，虽然比对称加密慢，但安全性更高。

在 TypeScript 项目中，我们可以封装一个工具类来简化操作。以下是基于 jsencrypt 库的实现思路：

import { JSEncrypt } from 'jsencrypt';

const publicKey = "MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBAKoR8mX0rGKLqzcWmOzbfj64K8ZIgOdH\n" +
  "nzkXSOVOZbFu/TJhZ7rFAN+eaGkl3C4buccQd/EjEsj9ir7ijT7h96MCAwEAAQ==";

const privateKey = "MIIBVAIBADANBgkqhkiG9w0BAQEFAASCAT4wggE6AgEAAkEAqhHyZfSsYourNxaY\n" +
  "7Nt+PrgrxkiA50efORdI5U5lsW79MmFnusUA355oaSXcLhu5xxB38SMSyP2KvuKN\n" +
  "PuH3owIDAQABAkAfoiLyL+Z4lf4Myxk6xUDgLaWGximj20CUf+5BKKnlrK+Ed8gA\n" +
  "kM0HqoTt2UZwA5E2MzS4EI2gjfQhz5X28uqxAiEA3wNFxfrCZlSZHb0gn2zDpWow\n" +
  "cSxQAgiCstxGUoOqlW8CIQDDOerGKH5OmCJ4Z21v+F25WaHYPxCFMvwxpcw99Ecv\n" +
  "DQIgIdhDTIqD2jfYjPTY8Jj3EDGPbH2HHuffvflECt3Ek60CIQCFRlCkHpi7hthh\n" +
  "YhovyloRYsM+IS9h/0BzlEAuO0ktMQIgSPT3aFAgJYwKpqRYKlLDVcflZFCKY7u3\n" +
  "UP8iWi1Qw0Y=";

export const encrypt = (txt: string) => {
  const encryptor = new JSEncrypt();
  encryptor.setPublicKey(publicKey);
  return encryptor.encrypt(txt);
};

export const decrypt = (txt: string) => {
  const encryptor = new JSEncrypt();
  encryptor.setPrivateKey(privateKey);
  return encryptor.decrypt(txt);
};

在 Vue 组件中调用时，只需引入上述方法即可。记得私钥不要硬编码在前端代码中，实际生产环境通常由后端生成密钥对，前端只保留公钥用于加密敏感信息。

核心概念补充

为了更清晰地选择方案，这里简单回顾一下几个关键概念：

对称 vs 非对称

对称加密（如 AES）速度快，适合大数据，但密钥分发困难。非对称加密（如 RSA）解决了密钥分发问题，但速度慢，适合小数据或密钥交换。

哈希算法

哈希是将任意长度输入映射为固定长度输出的过程。它具有确定性、定长、不可逆和雪崩效应。常见的用途包括文件指纹校验、密码存储（存摘要而非明文）、URL 签名防篡改等。记住，哈希不是加密，无法'解密'，只能通过暴力破解或查表尝试还原。

希望这些内容能帮你在前端安全建设中少走弯路。