Web Cryptography API 提供浏览器原生加密功能,支持生成密钥、加密解密等操作;2. 使用 crypto.subtle.generateKey() 生成 AES-GCM 对称密钥,需设置 extractable 和使用权限;3. 加密通过 crypto.subtle.encrypt() 执行,明文转 ArrayBuffer 并使用唯一 IV;4. 解密调用 crypto.subtle.decrypt(),验证 IV 和密文完整性;5. 密钥可导出为 JWK 格式存储,但仅当 extractable 为 true 时可用,需注意安全风险;6. 正确使用算法参数与密钥管理可实现前端端到端数据保护。

JavaScript 的 Web Cryptography API 提供了一套强大的加密功能,可以在浏览器端安全地执行加密、解密、签名和哈希等操作。它不依赖外部库,原生支持现代浏览器,适合处理敏感数据的加解密。
生成加密密钥
使用 crypto.subtle.generateKey() 可以生成对称或非对称密钥。例如,使用 AES-GCM 算法生成一个对称密钥用于加密解密:
const generateKey = async () => { return await crypto.subtle.generateKey( { name: "AES-GCM", length: 256 }, true, // 是否可提取 ["encrypt", "decrypt"] );};
生成的密钥可用于后续的加密和解密流程。注意:密钥默认不可提取,增强安全性。
数据加密
使用 crypto.subtle.encrypt() 对数据进行加密。需要提供算法配置、密钥和明文数据(需转换为 ArrayBuffer)。
立即学习“Java免费学习笔记(深入)”;
const encryptData = async (plaintext, key) => { const encoder = new TextEncoder(); const data = encoder.encode(plaintext); const iv = crypto.getRandomValues(new Uint8Array(12)); // 初始化向量 const ciphertext = await crypto.subtle.encrypt( { name: "AES-GCM", iv: iv }, key, data ); return { ciphertext, iv };};
AES-GCM 是推荐的加密模式,提供认证加密,防止数据篡改。每次加密应使用唯一的 IV(初始化向量)。
数据解密
使用 crypto.subtle.decrypt() 进行解密,传入相同的算法参数、密钥和加密时保存的 IV。
const decryptData = async (ciphertext, key, iv) => { const decryptedBuffer = await crypto.subtle.decrypt( { name: "AES-GCM", iv: iv }, key, ciphertext ); const decoder = new TextDecoder(); return decoder.decode(decryptedBuffer);};
如果密文被篡改或 IV 不匹配,解密会失败并抛出异常,确保数据完整性。
密钥导出与存储(可选)
若需将密钥保存或传输,可使用 crypto.subtle.exportKey() 导出为 JSON Web Key (JWK) 格式:
const exportKey = async (key) => { return await crypto.subtle.exportKey("jwk", key);};
导出的密钥可以序列化为 JSON 存储,但仅在设置 extractable: true 时可用。注意:暴露密钥有安全风险,应谨慎处理。
基本上就这些。Web Cryptography API 提供了安全可靠的加解密能力,关键在于正确使用算法参数、管理密钥和 IV。只要遵循标准流程,就能在前端实现端到端的数据保护。
以上就是如何通过 JavaScript 的 Web Cryptography API 进行加密解密操作?的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1523149.html
微信扫一扫
支付宝扫一扫