Question

请原谅我不懂英语，因为我不住在说英语的国家。

我是学生，我想编写文件加密代码并使用jquery（在客户端）下载该文件。

我解决了，但是有一些问题。

当我上传用于加密大文件的文件时，我的网站已崩溃。（我的代码将应用于一个简单的首页。）

当我在firefox或icedragon浏览器中运行该过程时，我会看到“分配大小溢出”的错误。

你能告诉我为什么这个问题发生了吗？

我编写的代码在下面，引用地址为here。

$(function(){

var body = $('body'),
    stage = $('#stage'),
    back = $('a.back');

/* Step 1 */

$('#step1 .encrypt').click(function(){
    body.attr('class', 'encrypt');

    // Go to step 2
    step(2);
});

$('#step1 .decrypt').click(function(){
    body.attr('class', 'decrypt');
    step(2);
});


/* Step 2 */


$('#step2 .button').click(function(){
    // Trigger the file browser dialog
    $(this).parent().find('input').click();
});


// Set up events for the file inputs

var file = null;

$('#step2').on('change', '#encrypt-input', function(e){

    // Has a file been selected?

    if(e.target.files.length!=1){
        alert('Please select a file to encrypt!');
        return false;
    }

    file = e.target.files[0];

    /*if(file.size > 1024*1024*50){
        alert('Please choose files smaller than 50mb, otherwise you may crash your browser. \nThis WARNING is for you.');
        return;
    }*/

    step(3);
});

$('#step2').on('change', '#decrypt-input', function(e){

    if(e.target.files.length!=1){
        alert('Please select a file to decrypt!');
        return false;
    }

    file = e.target.files[0];
    step(3);
});


/* Step 3 */


$('a.button.process').click(function(){

    var input = $(this).parent().find('input[type=password]'),
        a = $('#step4 a.download'),
        password = input.val();

    input.val('');

    if(password.length<5){
        alert('Please choose a longer password!');
        return;
    }

    // The HTML5 FileReader object will allow us to read the
    // contents of the  selected file.

    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);


            var encryptedFileArray = [encrypted];
            var blob = 'Blob Data';
            var fileName = file.name + '.encrypted';

            if(window.navigator.msSaveOrOpenBlob) {
                window.navigator.msSaveOrOpenBlob(blob, fileName);
            } else {

                var blobEncrypted = new Blob(encryptedFileArray, { type: 'application/octet-stream' });

                var blobUrl = URL.createObjectURL(blobEncrypted);
                $(a).attr({
                    'download': file.name + '.encrypted',
                    'href': blobUrl
                });
            }

            // 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.
            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;
            }


            var url = decrypted; 
            var userAgent = navigator.userAgent; 
            var filename = file.name.replace('.encrypted',''); 
            var xhr = new XMLHttpRequest(); 

            xhr.responseType = 'blob';
            xhr.onload = function () {
                $(a).attr({
                    'download': filename,
                    'href': window.URL.createObjectURL(xhr.response) // xhr.response is a blob
                });
            };
            xhr.open('GET', url);
            xhr.send();

            step(4);
        };

        reader.readAsText(file);
    }
});


/* The back button */


back.click(function(){

    // Reinitialize the hidden file inputs,
    // so that they don't hold the selection
    // from last time

    $('#step2 input[type=file]').replaceWith(function(){
        return $(this).clone();
    });

    step(1);
});


// Helper function that moves the viewport to the correct step div

function step(i){

    if(i == 1){
        back.fadeOut();
    }
    else{
        back.fadeIn();
    }

    // Move the #stage div. Changing the top property will trigger
    // a css transition on the element. i-1 because we want the
    // steps to start from 1:

    stage.css('top',(-(i-1)*100)+'%');
}

}）;

Answer 1

xhr.open('GET', url);

您正在使用GET方法。也许使用POST更好。您的服务器端语言是什么？是PHP吗？如果是PHP，最好检查“ php.ini”文件中的文件上传大小。

使用JavaScript控制文件的限制

1 个答案: