加解密技术详解:纯前端如何实现 AES / SM4 / RSA / 国密 SM2
技术方向:前端密码学 | 对称加密 / 非对称加密 / 国密 / node-forge / sm-crypto
文章目录
- [加解密技术详解:纯前端如何实现 AES / SM4 / RSA / 国密 SM2](#加解密技术详解:纯前端如何实现 AES / SM4 / RSA / 国密 SM2)
-
- 这些技术解决什么问题
- [对称加密:AES / DES / 3DES / SM4 / RC4](#对称加密:AES / DES / 3DES / SM4 / RC4)
- [非对称加密与签名:RSA / 国密 SM2](#非对称加密与签名:RSA / 国密 SM2)
-
- 在工具里的落地
- [这项技术能支撑哪些工具 / 场景](#这项技术能支撑哪些工具 / 场景)
- 背后支撑:纯前端密码学库
- 小结:这些技术还能延伸到哪
这些技术解决什么问题
加解密在解决三件事:机密性------别人看不到你的内容;完整性------内容没被偷偷改过;身份认证------对方真就是他说的那个人。下面把加解密工具背后用到的几门技术摊开讲:对称加密、非对称加密与国密算法,以及让它们在浏览器里跑起来的那几个纯前端密码学库。
对称加密:AES / DES / 3DES / SM4 / RC4
对称加密,顾名思义就是加密和解密用同一把密钥。你拿这把密钥把明文变成密文,对方再拿同一把密钥还原回来。它速度快,所以一般拿来加密体积比较大的数据。
AES:现代对称分组密码的事实标准,支持 128/192/256 位密钥(工具里文本口令经 SHA-256 派生成 16/24/32 字节密钥)。
DES / 3DES:早期标准,DES 密钥只有 56 位,现在已经不安全;3DES 用三倍密钥加强,属于怀旧选项。
SM4:咱们自己的商用密码标准(国密)对称算法,安全强度和 AES 相当。
RC4:流密码,没有分组和模式的概念,实现简单,适合轻量场景。
模式与 IV:CBC 模式需要初始化向量 IV(工具里留空会自动生成并回显),ECB 不需要;CBC 比 ECB 更安全。
在工具里的落地
落到工具上,操作很直白:选算法和模式、填入口令(或 HEX 密钥)和明文,点一下就拿到 Base64 或 HEX 的密文。对称加密这一页长这样:

图 1:AES-CBC 对称加密界面(输入明文后一键得到密文,IV 自动生成)
这项技术能支撑哪些工具/场景
加解密工具本身(对称页签)。
文件加密锁:用 AES-256-GCM 在本地加密任意文件或文本,密码走 PBKDF2 派生。
本地保存敏感配置、临时加密一段文本再发出去。
再往外说,HTTPS/TLS、Wi-Fi WPA2、磁盘加密,底层都是对称加密。
非对称加密与签名:RSA / 国密 SM2
对称加密有个麻烦:密钥怎么安全地交到对方手上?非对称加密用一对密钥来化解------公钥公开,用来加密或验签;私钥自己留着,用来解密或签名。
RSA:经典非对称算法,工具用 RSA-OAEP(配合 SHA-256)做加密,用 SHA-256 做签名 / 验签,密钥是 PEM 格式,支持 2048 / 4096 位。
国密 SM2:咱们的椭圆曲线公钥算法,加密采用 C1C3C2 密文格式,签名时对消息做 SM3 杂凑再签,符合 GM/T 0003 系列规范。
签名 / 验签:用私钥对消息摘要签名,任何人拿公钥就能验证「这消息确实出自私钥持有者、而且没被改过」。
在工具里的落地
工具里可以一键生成 RSA 或 SM2 的密钥对,然后用公钥直接加密、私钥解密,也能做签名和验签。SM2 这边生成密钥对后,拿公钥把明文加密,得到的密文长这样:

图 2:国密 SM2 公钥加密,明文经 C1C3C2 编码得到 HEX 密文
这项技术能支撑哪些工具 / 场景
加解密工具(RSA / SM2 页签)。
SSL 证书助手:本地生成 RSA 私钥 / CSR、自签证书。
JWT 解析:本地验签并算过期时间。
文件签名 / 电子签章。
凡是涉及身份认证、防篡改、密钥交换的地方。
背后支撑:纯前端密码学库
node-forge:纯 JavaScript 写的 TLS/密码学工具集,工具拿它做 AES/DES/3DES 的分组加密,以及 RSA 的密钥对、加解密、签名。
sm-crypto:国密算法(SM2/SM3/SM4)的 JS 实现,工具用它落地国密的加解密与签名。
Web 运行环境:所有运算都在浏览器本地完成,没有网络请求,明文/密钥/密文只在内存里走一遭。
小结:这些技术还能延伸到哪
加解密工具用到的技术,基本就三块:对称加密、非对称加密与国密算法,以及一套能在浏览器里跑的密码学库。文件加密、证书签发、Token 验签、电子签章,底层也是同一套。