Question

我试图运行使用jQuery 1.10.2和CryptoJS 3.2.1的浏览器加密应用程序我面临的问题始于2mb左右的文件。文件可以很好地加密，但是当为文件创建数据URI时，它会使浏览器崩溃。

我想解决这个问题，以便在不破坏浏览器的情况下加密高达50mb的文件。

以下是负责通过FileReader API保存文件的当前snippt

var reader = new FileReader();

        if(body.hasClass('encrypt')){

            // Encrypt the file!

            reader.onload = function(e){

                // Use the CryptoJS library and the AES cypher to encrypt the 
                // contents of the file, held in e.target.result, with the password

                var encrypted = CryptoJS.AES.encrypt(e.target.result, password);

                // The download attribute will cause the contents of the href
                // attribute to be downloaded when clicked. The download attribute
                // also holds the name of the file that is offered for download.

                a.attr('href', 'data:application/octet-stream,' + encrypted);
                a.attr('download', file.name + '.encrypted');

                step(4);
            };

            // This will encode the contents of the file into a data-uri.
            // It will trigger the onload handler above, with the result

            reader.readAsDataURL(file);
        }
        else {

            // Decrypt it!

            reader.onload = function(e){

                var decrypted = CryptoJS.AES.decrypt(e.target.result, password)
                                        .toString(CryptoJS.enc.Latin1);

                if(!/^data:/.test(decrypted)){
                    alert("Invalid pass phrase or file! Please try again.");
                    return false;
                }

                a.attr('href', decrypted);
                a.attr('download', file.name.replace('.encrypted',''));

                step(4);
            };

            reader.readAsText(file);
        }

我可以在上面的代码中更改哪些内容以允许加密和解密更大的文件？

直播网站：droplet.so（目前上限为1.5mb，否则保证浏览器崩溃）

请提前感谢。

Answer 1

通过一些研究，我发现1.99MB是可以在chrome中保存在数据网址中的最大值。

您的问题可以通过将数据网址转换为blob来完成

您可以在此处找到更多信息： Blob from DataURL?

Chrome crashes when URI is too long这里有类似的帖子（见第二个答案）。

编辑：

可能的解决方案

function dataURItoBlob(dataURI) {
  var byteString = atob(dataURI.split(',')[1]);

  var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]

  var ab = new ArrayBuffer(byteString.length);
  var ia = new Uint8Array(ab);
  for (var i = 0; i < byteString.length; i++) {
      ia[i] = byteString.charCodeAt(i);
  }

  var bb = new BlobBuilder();
  bb.append(ab);
  return bb.getBlob(mimeString);
}

function download(dataURI) {
    var blob = dataURItoBlob(dataURI);
    var url  = window.URL.createObjectURL(blob);
    window.location.assign(url);
}

您可以通过调用download(dataURI)来使用此代码。

通过Filesystem API导出文件时Chrome崩溃

1 个答案: