首页 > web前端 > js教程 > 正文

JavaScript加密与哈希算法

夜晨
发布: 2025-10-17 10:06:02
原创
261人浏览过
JavaScript前端数据安全需结合加密与哈希技术,1. 使用Web Crypto API实现SHA-256哈希和AES-GCM对称加密;2. 可借助crypto-js等库简化操作;3. 前端仅作预处理,不可替代后端安全机制,须避免硬编码密钥、配合HTTPS与后端验证使用。

javascript加密与哈希算法

JavaScript在前端处理数据安全时,常涉及加密与哈希技术。虽然前端环境无法完全替代后端安全机制,但在特定场景下(如数据预处理、临时保护、配合后端验证)使用加密和哈希算法仍有一定价值。以下介绍常见类型及其实现方式。

哈希算法(Hash Functions)

哈希是将任意长度数据转换为固定长度摘要的过程,具有不可逆性,常用于密码存储校验、数据完整性验证。

常用算法:
  • SHA-256:属于SHA-2系列,安全性高
  • MD5:已不推荐用于安全场景,易碰撞
  • SHA-1:已被逐步淘汰

浏览器原生支持 Web Crypto API 实现安全哈希:

async function hashData(data) {
  const encoder = new TextEncoder();
  const dataBuffer = encoder.encode(data);
  const hashBuffer = await crypto.subtle.digest('SHA-256', dataBuffer);
  const hashArray = Array.from(new Uint8Array(hashBuffer));
  return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
}

// 使用示例
hashData('hello world').then(console.log); // 输出: 2ef7bde608ce5404e97d5f042f95f89f1c232871...
登录后复制

对称加密(Symmetric Encryption)

使用同一密钥进行加密和解密,适合前后端共享密钥的场景,如AES算法。

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

Web Crypto API 支持 AES-GCM 等现代模式:

算家云
算家云

高效、便捷的人工智能算力服务平台

算家云 37
查看详情 算家云
async function encryptAES(keyStr, plaintext) {
  const iv = crypto.getRandomValues(new Uint8Array(12)); // 初始化向量
  const keyMaterial = await crypto.subtle.importKey(
    'raw',
    new TextEncoder().encode(keyStr),
    { name: 'PBKDF2' },
    false,
    ['deriveKey']
  );
  const key = await crypto.subtle.deriveKey(
    { name: 'PBKDF2', salt: iv, iterations: 100000, hash: 'SHA-256' },
    keyMaterial,
    { name: 'AES-GCM', length: 256 },
    false,
    ['encrypt', 'decrypt']
  );

  const encrypted = await crypto.subtle.encrypt(
    { name: 'AES-GCM', iv },
    key,
    new TextEncoder().encode(plaintext)
  );

  return { 
    ciphertext: Array.from(new Uint8Array(encrypted)),
    iv: Array.from(iv)
  };
}
登录后复制

常见第三方库简化操作

若需更简洁语法,可使用成熟库:

  • crypto-js:兼容性强,支持多种算法
  • js-sha256:轻量SHA-256实现

安装 crypto-js:

npm install crypto-js
登录后复制

使用示例:

const CryptoJS = require('crypto-js');

// MD5(仅作演示,勿用于安全场景)
console.log(CryptoJS.MD5("message").toString());

// AES 加密
const ciphertext = CryptoJS.AES.encrypt('my message', 'secret key');
console.log(ciphertext.toString());

// 解密
const bytes = CryptoJS.AES.decrypt(ciphertext, 'secret key');
const originalText = bytes.toString(CryptoJS.enc.Utf8);
console.log(originalText); // 输出: my message
登录后复制

注意事项与安全建议

前端JavaScript运行在用户环境中,所有代码和密钥都可能被查看或篡改,因此:

  • 不要在前端硬编码敏感密钥
  • 避免单独依赖前端加密保障安全
  • 哈希不可逆,但弱密码仍可被字典攻击
  • 推荐结合HTTPS + 后端验证 + Token机制使用
  • 优先使用Web Crypto API而非自研算法

基本上就这些。理解每种技术的适用边界,才能合理构建安全的数据交互流程。

以上就是JavaScript加密与哈希算法的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号