如何安全使用Crypto.subtle进行Web应用本地测试且规避安全风险？

以下是针对Web应用中Crypto.subtle的本地测试安全方案，同时兼顾生产环境的安全性：

1. 强制使用本地HTTPS环境 #

Crypto.subtle在非安全上下文（HTTP）中部分API会被限制，且HTTP环境下传输测试数据存在被窃听风险。本地测试时务必启用HTTPS：

• 用mkcert生成可信的本地SSL证书，步骤如下：

  # 安装mkcert
  brew install mkcert  # macOS
  choco install mkcert  # Windows
  # 生成本地CA证书
  mkcert -install
  # 为localhost生成证书
  mkcert localhost 127.0.0.1 ::1
  

• 在开发服务器（如Webpack、Vite）中配置使用生成的证书，确保本地访问地址为https://localhost。

2. 彻底隔离测试与生产密钥 #

绝对禁止在本地测试环境使用生产密钥，测试用密钥需临时生成、用完即弃：

// 本地测试时临时生成AES密钥，仅用于测试
async function generateTestAESKey() {
  return await crypto.subtle.generateKey(
    { name: "AES-GCM", length: 256 },
    true, // 可导出（测试用，生产环境按需设置）
    ["encrypt", "decrypt"]
  );
}

// 测试完成后主动销毁密钥（浏览器环境可通过覆盖变量实现）
let testKey = await generateTestAESKey();
// 测试结束后
testKey = null;

3. 禁止硬编码敏感信息 #

任何与加密相关的敏感信息（密钥、盐值、IV等）都不能硬编码到代码中：

• 本地测试时用环境变量传递敏感参数（Node.js环境），或临时存入浏览器sessionStorage（仅测试用，生产环境禁止）：

// 本地测试从环境变量获取盐值（Node.js）
const testSalt = process.env.TEST_SALT || new Uint8Array(16);

// 浏览器本地测试用sessionStorage存储临时IV（关闭页面自动清除）
sessionStorage.setItem('test_iv', btoa(String.fromCharCode(...new Uint8Array(12))));

4. 模拟生产环境的安全约束 #

本地测试时尽量复刻生产环境的安全策略，避免因环境差异埋下隐患：

• 配置Content-Security-Policy（CSP）限制Crypto.subtle的使用范围，示例：

<meta http-equiv="Content-Security-Policy" content="script-src 'self'; crypto-src 'self'">

• 测试时禁用浏览器的安全绕过选项（如--disable-web-security），确保加密逻辑在标准安全环境下运行。

5. 聚焦加密逻辑正确性，而非环境宽松性 #

本地测试的核心是验证加密/解密、哈希等逻辑的正确性，而非依赖本地环境的宽松设置：

// 测试SHA-256哈希一致性
async function testHashConsistency() {
  const data = new TextEncoder().encode("test-data");
  const hashBuffer = await crypto.subtle.digest("SHA-256", data);
  const hashArray = Array.from(new Uint8Array(hashBuffer));
  const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
  
  // 验证哈希值是否符合预期（与其他工具生成的结果对比）
  console.assert(hashHex === "912ec803b2ce49e4a541068d495ab570586d549d", "哈希验证失败");
}

6. 测试后清理本地敏感数据 #

每次测试结束后，主动清理浏览器存储的测试密钥、加密数据：

// 清理sessionStorage中的测试数据
sessionStorage.removeItem('test_iv');
sessionStorage.removeItem('test_key');

// 若使用IndexedDB存储测试数据，需删除对应存储对象
const request = indexedDB.deleteDatabase('test-crypto-db');
request.onsuccess = () => console.log("测试数据库已删除");

内容的提问来源于stack exchange，提问作者Lakhvir Singh