js+原生加密

基础概念

JavaScript（简称JS）是一种广泛使用的脚本语言，主要用于网页和网络应用的客户端脚本。原生加密指的是在JavaScript中使用内置的加密功能或API来进行数据的加密和解密操作。

类型

对称加密：使用相同的密钥进行加密和解密，常见的算法有AES（高级加密标准）。
非对称加密：使用一对密钥，一个用于加密，另一个用于解密，常见的算法有RSA。
哈希函数：用于生成数据的固定长度的唯一表示，常见的算法有SHA-256。

应用场景

数据传输加密：在客户端和服务器之间传输敏感数据时进行加密。
本地存储加密：对存储在浏览器本地存储（如LocalStorage）中的数据进行加密。
身份验证：使用非对称加密进行数字签名和验证。

示例代码

对称加密（AES）

// 加密
async function encryptData(data, key) {
    const encoder = new TextEncoder();
    const encodedData = encoder.encode(data);
    const cryptoKey = await window.crypto.subtle.importKey(
        "raw",
        encoder.encode(key),
        { name: "AES-GCM" },
        false,
        ["encrypt"]
    );
    const iv = window.crypto.getRandomValues(new Uint8Array(12));
    const encryptedData = await window.crypto.subtle.encrypt(
        { name: "AES-GCM", iv },
        cryptoKey,
        encodedData
    );
    return { encryptedData, iv };
}

// 解密
async function decryptData(encryptedData, key, iv) {
    const decoder = new TextDecoder();
    const cryptoKey = await window.crypto.subtle.importKey(
        "raw",
        new TextEncoder().encode(key),
        { name: "AES-GCM" },
        false,
        ["decrypt"]
    );
    const decryptedData = await window.crypto.subtle.decrypt(
        { name: "AES-GCM", iv },
        cryptoKey,
        encryptedData
    );
    return decoder.decode(decryptedData);
}

// 使用示例
(async () => {
    const data = "Hello, World!";
    const key = "my-secret-key";
    const { encryptedData, iv } = await encryptData(data, key);
    const decryptedData = await decryptData(encryptedData, key, iv);
    console.log("Original Data:", data);
    console.log("Decrypted Data:", decryptedData);
})();

非对称加密（RSA）

// 生成密钥对
async function generateKeyPair() {
    return await window.crypto.subtle.generateKey(
        { name: "RSA-OAEP", modulusLength: 2048, publicExponent: new Uint8Array([1, 0, 1]), hash: "SHA-256" },
        true,
        ["encrypt", "decrypt"]
    );
}

// 加密
async function encryptData(data, publicKey) {
    const encoder = new TextEncoder();
    const encodedData = encoder.encode(data);
    const encryptedData = await window.crypto.subtle.encrypt(
        { name: "RSA-OAEP" },
        publicKey,
        encodedData
    );
    return encryptedData;
}

// 解密
async function decryptData(encryptedData, privateKey) {
    const decoder = new TextDecoder();
    const decryptedData = await window.crypto.subtle.decrypt(
        { name: "RSA-OAEP" },
        privateKey,
        encryptedData
    );
    return decoder.decode(decryptedData);
}

// 使用示例
(async () => {
    const { publicKey, privateKey } = await generateKeyPair();
    const data = "Hello, World!";
    const encryptedData = await encryptData(data, publicKey);
    const decryptedData = await decryptData(encryptedData, privateKey);
    console.log("Original Data:", data);
    console.log("Decrypted Data:", decryptedData);
})();

遇到的问题及解决方法

兼容性问题：某些旧版本的浏览器可能不支持某些加密算法或API。可以通过检测浏览器支持情况或使用Polyfill来解决。
性能问题：加密操作可能会消耗较多的计算资源，导致页面性能下降。可以通过优化加密算法选择、减少不必要的加密操作或使用Web Workers来分担主线程压力。
密钥管理：密钥的安全存储和管理是一个重要问题。可以使用浏览器的window.crypto.subtle API来安全地存储和管理密钥。

通过以上方法，可以在JavaScript中实现安全的原生加密和解密操作，保护数据的机密性和完整性。