Question

我正在创建一个客户端javascript应用程序，它只在客户端上传文件并在客户端本身处理它。（它不会将文件发送给服务器）

我编写的代码很容易在客户端加载小文件，但挂起浏览器加载大文件（如大小为100MB的文件）。

我已经在文件加载后发出警报（即在onload函数内）。即使当我尝试上传大文件时，它也会给我提醒，这意味着该文件已经加载但是当它尝试将保存在变量中的文件文本blob复制到div的内部html时，浏览器会被挂起。

我已经在JSFIDDLE（http://jsfiddle.net/q0x90jsv/1/）以及下面编写了代码。

HTML代码

<input type="file" id="myfile" />
<p id="sel">Data will appear here</p>

Javascript代码

function readFile(evt) {
    var files = evt.target.files;
    var file = files[0];
    var reader = new FileReader();
    // reader.onload = function() {
    // console.log(this.result);
    // }
    reader.readAsText(file)
    reader.onload = function (e) {
        alert("FILE LOADED");
        var f = reader.result;

        document.getElementById("sel").innerHTML = f;
    }
}


$(document).ready(function () {
    //adding mouse up listener to get selected text from left pane
    document.getElementById('myfile').addEventListener('change', readFile, false);
});

此外，当我尝试在浏览器中打开大文件（100MB）时（使用简单的FILE-＆gt; OPEN-＆gt; BROWSE FILE-＆gt; OPEN）它很容易打开。

如果有办法解决这个问题，请告诉我。

使用javascript在客户端上传大文件后浏览器挂起

0 个答案: