在JavaScript中,如何实现数据的加密、解密和哈希运算?

37次阅读

JavaScript中实现加密、解密和哈希运算,推荐使用Web Crypto API。1. 使用AES-GCM进行对称加密:通过crypto.subtle.generateKey生成密钥,encrypt加密数据并生成初始化向量iv,decrypt配合iv还原数据。2. SHA-256哈希:调用crypto.subtle.digest计算数据指纹,结果转为十六进制字符串。3. 兼容旧环境可选CryptoJS库:通过CryptoJS.AES.encrypt/decrypt实现加解密,CryptoJS.MD5/SHA256生成哈希。注意事项包括避免硬编码密钥、妥善处理ArrayBuffer编码、前端加密不替代HTTPS传输安全。现代项目应优先采用Web Crypto API。

在JavaScript中,如何实现数据的加密、解密和哈希运算?

JavaScript 中实现数据的加密、解密和哈希运算,通常依赖 Web Crypto API(现代浏览器原生支持)或第三方库如 cryptojs。以下是具体实现方式。

使用 Web Crypto API(推荐,安全且无需引入库)

Web Crypto API 是浏览器内置的安全接口,支持 AES 加密、RSA 非对称加密、SHA 哈希等操作。

1. 数据加密与解密(AES-GCM 示例)

对称加密,适合加密本地数据或传输内容。

// 生成密钥 async function generateKey() {   return await crypto.subtle.generateKey(     { name: "AES-GCM", length: 256 },     true,     ["encrypt", "decrypt"]   ); }  // 加密 async function encryptData(data, key) {   const encoder = new TextEncoder();   const encodedData = encoder.encode(data);   const iv = crypto.getRandomValues(new Uint8Array(12)); // 初始化向量    const encrypted = await crypto.subtle.encrypt(     { name: "AES-GCM", iv },     key,     encodedData   );    return { encrypted, iv }; }  // 解密 async function decryptData(encryptedData, key, iv) {   const decrypted = await crypto.subtle.decrypt(     { name: "AES-GCM", iv },     key,     encryptedData   );    const decoder = new TextDecoder();   return decoder.decode(decrypted); }  // 使用示例 (async () => {   const key = await generateKey();   const { encrypted, iv } = await encryptData("Hello, 世界!", key);   const result = await decryptData(encrypted, key, iv);   console.log(result); // 输出: Hello, 世界! })();

2. 哈希运算(SHA-256 示例)

用于生成数据指纹,不可逆。

async function hashData(data) {   const encoder = new TextEncoder();   const encodedData = encoder.encode(data);   const hashBuffer = await crypto.subtle.digest("SHA-256", encodedData);    // 转为十六进制字符串   const hashArray = Array.from(new Uint8Array(hashBuffer));   const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');   return hashHex; }  // 使用示例 hashData("hello").then(console.log); // 输出类似: 2cf24dba5fb0a30e26e83b2ac5b9e29e1b161e5c1fa7425e73043362938b9824

使用 CryptoJS 库(兼容旧环境)

如果需要支持不完整 Web Crypto 的环境,可使用 crypto-js

先通过 CDN 或 npm 引入:

立即学习Java免费学习笔记(深入)”;

在JavaScript中,如何实现数据的加密、解密和哈希运算?

腾讯智影-AI数字人

基于AI数字人能力,实现7*24小时AI数字人直播带货,低成本实现直播业务快速增增,全天智能在线直播

在JavaScript中,如何实现数据的加密、解密和哈希运算?73

查看详情 在JavaScript中,如何实现数据的加密、解密和哈希运算?

“`html “`

1. AES 加解密

“`javascript const message = “Hello, 世界!”; const secretKey = “my-secret-key”;

// 加密 const encrypted = CryptoJS.AES.encrypt(message, secretKey).toString();

// 解密 const bytes = CryptoJS.AES.decrypt(encrypted, secretKey); const decrypted = bytes.toString(CryptoJS.enc.Utf8);

console.log(decrypted); // 输出: Hello, 世界!

<p><strong>2. MD5 和 SHA 哈希</strong></p> ```javascript console.log(CryptoJS.MD5("hello"));     // MD5 console.log(CryptoJS.SHA256("hello"));  // SHA-256

注意事项

实际开发中需注意以下几点:

  • 密钥不能硬编码在代码中,应通过安全方式获取(如用户输入、后端协商)
  • Web Crypto API 返回的是 ArrayBuffer,处理时注意编码转换
  • 哈希不可逆,适用于密码存储(配合盐值 salt)
  • 前端加密不能替代 HTTPS,仅作为辅助安全措施

基本上就这些。现代项目优先使用 Web Crypto API,简单场景可用 CryptoJS 快速实现。

javascript java html js 前端 编码 浏览器 后端 ai cdn 数据加密 crypto JavaScript html npm const 字符串 接口 JS console https

text=ZqhQzanResources