加解密技术详解:纯前端如何实现 AES / SM4 / RSA / 国密 SM2

加解密技术详解:纯前端如何实现 AES / SM4 / RSA / 国密 SM2

技术方向:前端密码学 | 对称加密 / 非对称加密 / 国密 / node-forge / sm-crypto

文章目录

这些技术解决什么问题

加解密在解决三件事:机密性------别人看不到你的内容;完整性------内容没被偷偷改过;身份认证------对方真就是他说的那个人。下面把加解密工具背后用到的几门技术摊开讲:对称加密、非对称加密与国密算法,以及让它们在浏览器里跑起来的那几个纯前端密码学库。

对称加密: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 验签、电子签章,底层也是同一套。

相关推荐
IT_陈寒4 小时前
JavaScript的this坑人实录,这次我真的记下来了
前端·人工智能·后端
开开心心就好5 小时前
音频降噪剪辑工具,音量裁剪一键处理
运维·服务器·前端·spring·ocr·音视频·1024程序员节
PedroQue996 小时前
0.8.2 新增 backFallback 配置,无 tabbar 页返回无忧
前端·uni-app
淡漠的蓝精灵7 小时前
web.py:一个简单到极致的 Python Web 框架
开发语言·前端·python·其他
开开心心就好7 小时前
竖式除法出题工具,整除余数混合模式
运维·服务器·前端·javascript·ocr·perl·1024程序员节
起个名字费劲死了7 小时前
Halcon学习一:骰子识别
前端·python·学习
大江东去浪淘尽千古风流人物7 小时前
【HexVIO】DSP卸载双目惯性VIO:Hexagon向量化前端与单帧融合调度深度解析
前端·状态模式·slam·dsp·vio·hexagon·移动端加速
其实防守也摸鱼7 小时前
Chrome 扩展安全攻防实录:从攻击面到防御实践
开发语言·前端·网络·chrome·安全·web安全·php
web打印社区7 小时前
Lodop排障总纲-常见报错一张表
开发语言·前端·javascript·chrome·websocket
李剑一8 小时前
为什么几乎所有的知名开源项目都是外国人写的?
前端·ai编程·deepseek