主页 / 问题 / 1441830
Accepted
Alexander
Asked:2022-08-23 14:10:17 +0800 CST2022-08-23 14:10:17 +0800 CST

用 CryptoJS 加密图片？

  • 772

任务是在 JS（仅限客户端）中编写一个程序，该程序使用用户使用标准防加密算法输入的密码来加密任意文件的内容（可能有很多文件并且很大）。在研究了需求之后，我从 CryptoJS 库中选择了 RC4 算法及其实现。

现在我有这个代码：https ://jsfiddle.net/alexander_js_developer/nuevwrp0/ 。

输入密码，密码哈希是加密和解密文件时的密钥。完美处理文本文件 ( .txt, .js)。但是，例如，图片无情地破裂。我知道我需要将图像转换为比特流并已经加密？还是有另一种更好/更快的解决方案？

谢谢！

javascript

1 个回答

  1. Best Answer

    要使用 base64，您需要 2 个函数

    const fileToBase64 = file => new Promise((resolve, reject) => {
  const reader = new FileReader();
  reader.readAsDataURL(file);
  reader.onload = () => resolve(reader.result);
  reader.onerror = error => reject(error);
});

const base64ToFile = (url, filename, mimeType) => {
  return (fetch(url)
    .then(function(res){return res.arrayBuffer();})
    .then(function(buf){return new File([buf], filename,{type:mimeType});})
  );
}

    （源代码链接 fileToBase64，base64ToFile）

    现有功能需要进行如下调整，在其中引入 base64 编码和解码步骤：

    encryptNode.addEventListener('click', () => {
  if (!passNode.value) return alert('Password input is empty! Aborting.');
  const pass = CryptoJS.SHA3(passNode.value);
  pickAFile(false).then(async(file) => {
    const data = await fileToBase64(file)
    const encrypted = CryptoJS.RC4.encrypt(data, pass).toString();
    download(encrypted, `encrypted-${file.name}`, file.type);
  });
});

decryptNode.addEventListener('click', () => {
  if (!passNode.value) return alert('Password input is empty! Aborting.');
  const pass = CryptoJS.SHA3(passNode.value);
  pickAFile(false).then((file) => {
    const reader = new FileReader();
    reader.onload = async(e) => {
      try {
        const decrypted = CryptoJS.RC4.decrypt(e.target.result, pass);
        const typedArray = convertWordArrayToUint8Array(decrypted);
        const data = await base64ToFile(new TextDecoder().decode(typedArray),
         `decrypted-${file.name}`, file.type)
        download(data, `decrypted-${file.name}`, file.type);
      } catch (error) {
        console.log('wrong password!', error);
      }
    };
    reader.readAsText(file);
  });
});
    • 1

相关问题