WebCrypto 加密存储实践：IndexedDB 与 OPFS

`title: WebCrypto 加密存储实践：IndexedDB 与 OPFS``categories: Web 开发/前端/数据管理``keywords: WebCrypto,SubtleCrypto,AES-GCM,加密,密钥管理,IndexedDB,OPFS``description: 使用 WebCrypto 的 AES-GCM 在浏览器端对数据加密后存储到 IndexedDB 或 OPFS，并提供密钥生成与导出导入的实践。`密钥生成与导出async function genKey() { return crypto.subtle.generateKey({ name: 'AES-GCM', length: 256 }, true, ['encrypt', 'decrypt']); } async function exportRawKey(key) { return new Uint8Array(await crypto.subtle.exportKey('raw', key)); } async function importRawKey(raw) { return crypto.subtle.importKey('raw', raw, { name: 'AES-GCM' }, true, ['encrypt', 'decrypt']); } 加密与解密async function encrypt(key, data) { const iv = crypto.getRandomValues(new Uint8Array(12)); const enc = await crypto.subtle.encrypt({ name: 'AES-GCM', iv }, key, data); return { iv, cipher: new Uint8Array(enc) }; } async function decrypt(key, iv, cipher) { const dec = await crypto.subtle.decrypt({ name: 'AES-GCM', iv }, key, cipher); return new Uint8Array(dec); } 存储到 OPFS 与 IndexedDBasync function saveCipherToOPFS(name, bytes) { const root = await navigator.storage.getDirectory(); const handle = await root.getFileHandle(name, { create: true }); const writable = await handle.createWritable(); await writable.write(bytes); await writable.close(); } function openKeyDB() { return new Promise((resolve, reject) => { const req = indexedDB.open('crypto-db', 1); req.onupgradeneeded = () => { const db = req.result; if (!db.objectStoreNames.contains('keys')) db.createObjectStore('keys', { keyPath: 'id' }); }; req.onsuccess = () => resolve(req.result); req.onerror = () => reject(req.error); }); } async function storeKey(db, id, raw) { return new Promise((resolve, reject) => { const tx = db.transaction('keys', 'readwrite'); tx.objectStore('keys').put({ id, raw: Array.from(raw) }); tx.oncomplete = () => resolve(); tx.onerror = () => reject(tx.error); }); }