当前位置:首页 > JavaScript

js实现加密

2026-02-01 12:37:51JavaScript

使用 Web Crypto API 进行加密

Web Crypto API 是现代浏览器提供的原生加密接口,支持 AES、RSA、SHA 等算法。以下示例展示如何使用 AES-GCM 加密数据:

async function encryptAES(text, password) {
  const encoder = new TextEncoder();
  const data = encoder.encode(text);

  const salt = crypto.getRandomValues(new Uint8Array(16));
  const keyMaterial = await crypto.subtle.importKey(
    'raw',
    encoder.encode(password),
    { name: 'PBKDF2' },
    false,
    ['deriveKey']
  );

  const key = await crypto.subtle.deriveKey(
    {
      name: 'PBKDF2',
      salt: salt,
      iterations: 100000,
      hash: 'SHA-256'
    },
    keyMaterial,
    { name: 'AES-GCM', length: 256 },
    false,
    ['encrypt']
  );

  const iv = crypto.getRandomValues(new Uint8Array(12));
  const encrypted = await crypto.subtle.encrypt(
    { name: 'AES-GCM', iv: iv },
    key,
    data
  );

  return {
    ciphertext: Array.from(new Uint8Array(encrypted)),
    iv: Array.from(iv),
    salt: Array.from(salt)
  };
}

使用 SJCL 库加密

Stanford JavaScript Crypto Library (SJCL) 是轻量级加密库,适合需要兼容旧浏览器的场景:

js实现加密

// 引入 SJCL 库后
function encryptWithSJCL(plaintext, password) {
  const ciphertext = sjcl.encrypt(password, plaintext, {
    iter: 10000,
    ks: 256,
    ts: 128,
    mode: 'gcm'
  });
  return ciphertext;
}

RSA 非对称加密实现

使用 Web Crypto API 生成密钥对并加密:

js实现加密

async function generateRSAKeys() {
  const keyPair = await crypto.subtle.generateKey(
    {
      name: 'RSA-OAEP',
      modulusLength: 2048,
      publicExponent: new Uint8Array([0x01, 0x00, 0x01]),
      hash: 'SHA-256'
    },
    true,
    ['encrypt', 'decrypt']
  );

  return {
    publicKey: await crypto.subtle.exportKey('jwk', keyPair.publicKey),
    privateKey: await crypto.subtle.exportKey('jwk', keyPair.privateKey)
  };
}

async function rsaEncrypt(publicKey, data) {
  const key = await crypto.subtle.importKey(
    'jwk',
    publicKey,
    { name: 'RSA-OAEP', hash: 'SHA-256' },
    false,
    ['encrypt']
  );

  const encrypted = await crypto.subtle.encrypt(
    { name: 'RSA-OAEP' },
    key,
    new TextEncoder().encode(data)
  );

  return Array.from(new Uint8Array(encrypted));
}

哈希函数示例

使用 SHA-256 生成消息摘要:

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

注意事项

所有加密操作应在 HTTPS 环境下进行,确保传输安全。敏感密钥应妥善存储,避免硬编码在客户端代码中。Web Crypto API 仅在安全上下文(Secure Context)中可用。

对于生产环境,建议结合后端服务进行密钥管理和更复杂的加密流程。浏览器端加密应作为安全链中的一环,而非唯一保障。

标签: js
分享给朋友:

相关文章

js实现轮播

js实现轮播

实现基础轮播效果 使用HTML结构创建轮播容器和图片元素: <div class="carousel"> <div class="carousel-inner">…

js实现分页

js实现分页

实现分页的基本思路 分页功能通常需要处理数据分割、页码生成和用户交互。核心逻辑包括计算总页数、根据当前页截取数据、渲染页码按钮等。 前端分页实现(静态数据) 假设已有全部数据,仅需前端分页展示:…

js实现动画

js实现动画

使用 CSS 动画与 JavaScript 控制 通过 JavaScript 动态添加或移除 CSS 类来触发动画。CSS 定义关键帧(@keyframes),JavaScript 通过 classL…

js实现打印

js实现打印

使用window.print()方法实现打印 在JavaScript中,可以通过调用window.print()方法直接触发浏览器的打印功能。这会打开系统的打印对话框,用户可以选择打印机和设置打印选项…

js 实现倒计时

js 实现倒计时

实现倒计时的基本方法 使用 JavaScript 实现倒计时可以通过 setInterval 或 setTimeout 结合日期计算来完成。以下是两种常见实现方式。 使用 setInterval 实…

js实现全选

js实现全选

实现全选功能的方法 在JavaScript中实现全选功能通常涉及监听全选复选框的点击事件,并根据其状态控制其他复选框的选中状态。以下是几种常见的实现方式: 基础DOM操作实现 通过获取所有目标复选…