JS如何实现加密传输

crypto-js

// 引入 crypto-js 库 (例如通过CDN或npm安装后import)
// <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>

// ⚠️ 警告：在生产环境中，密钥和IV绝不能硬编码在客户端JS中！
// 它们应该通过安全通道（如HTTPS）从服务器获取，并且有妥善的生命周期管理。
const secretKey = CryptoJS.enc.Utf8.parse("mySuperSecretKey12"); // 16 bytes for AES-128
const initVector = CryptoJS.enc.Utf8.parse("myInitVector123456"); // 16 bytes

/**
 * 客户端加密数据
 * @param {Object} dataToEncrypt - 需要加密的JS对象
 * @returns {string} 加密后的Base64字符串
 */
function encryptSensitiveData(dataToEncrypt) {
    try {
        // 将JS对象转换为JSON字符串，因为AES通常加密字符串
        const plaintext = JSON.stringify(dataToEncrypt);

        // 使用AES算法进行加密
        const encrypted = CryptoJS.AES.encrypt(plaintext, secretKey, {
            iv: initVector,
            mode: CryptoJS.mode.CBC, // 加密模式，CBC是常用且安全的模式
            padding: CryptoJS.pad.Pkcs7 // 填充方式
        });

        // 返回加密后的数据（通常是Base64编码的字符串，方便网络传输）
        return encrypted.toString();
    } catch (error) {
        console.error("加密失败:", error);
        return null;
    }
}

// 模拟要发送的敏感数据
const sensitiveUserInfo = {
    username: "user_test",
    password: "verySecurePassword!",
    email: "test@example.com"
};

// 在发送前加密数据
const encryptedPayload = encryptSensitiveData(sensitiveUserInfo);

if (encryptedPayload) {
    console.log("加密前数据:", sensitiveUserInfo);
    console.log("加密后数据 (Base64):", encryptedPayload);

    // 假设通过fetch API发送加密后的数据到服务器
    // ⚠️ 这里的URL必须是HTTPS协议的
    fetch('https://your-backend-api.com/submit-secure-info', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-Custom-Encrypted': 'true' // 可以添加自定义头部表明数据已加密
        },
        body: JSON.stringify({
            encryptedData: encryptedPayload
        })
    })
    .then(response => {
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('服务器响应:', data);
        // 服务器端会用相同的密钥和IV进行解密
    })
    .catch(error => {
        console.error('发送数据失败:', error);
    });
}

// ----------------------------------------------------------------------
// 服务器端（非JS环境，但逻辑类似）的解密概念：
/*
const CryptoJS = require('crypto-js'); // Node.js 环境下引入

function decryptData(encryptedBase64String) {
    const secretKey = CryptoJS.enc.Utf8.parse("mySuperSecretKey12");
    const initVector = CryptoJS.enc.Utf8.parse("myInitVector123456");

    try {
        const decrypted = CryptoJS.AES.decrypt(encryptedBase64String, secretKey, {
            iv: initVector,
            mode: CryptoJS.mode.CBC,
            padding: CryptoJS.pad.Pkcs7
        });
        return decrypted.toString(CryptoJS.enc.Utf8); // 解密后转换为UTF8字符串
    } catch (error) {
        console.error("解密失败:", error);
        return null;
    }
}

// 假设从请求体中获取到 encryptedPayload
// const receivedEncryptedData = "U2FsdGVkX1+......"; // 示例加密字符串
// const originalData = decryptData(receivedEncryptedData);
// console.log("服务器解密后:", originalData); // 应该得到原始的JSON字符串
*/