如何使用简单的Javascript获取文件的上传大小？

我有一个页面上的文件上传功能。我使用JavaScript检查文件的扩展名。现在我想限制用户上传大于1 MB的文件。有什么办法可以检查使用JavaScript的文件上传大小。如何使用简单的Javascript获取文件的上传大小？

我的代码目前是这样的：

<script language="JavaScript"> 
function validate() { 
    var filename = document.getElementById("txtChooseFile").value; 
    var ext = getExt(filename); 
    if(ext == "txt" || ext == "csv") 
     return true; 
    alert("Please upload Text files only."); 
    return false; 
} 

function getExt(filename) { 
    var dot_pos = filename.lastIndexOf("."); 
    if(dot_pos == -1) 
     return ""; 
    return filename.substr(dot_pos+1).toLowerCase(); 
} 
</script>

来源

2009-10-22 Pankaj Khurana

看到http://stackoverflow.com/questions/547292/how-to-retrieve-size-of-file – geowa4 2009-10-22 12:27:00

为什么接受了错误的答案吗？检查第二个答案=这是可能的！ – Darren 2012-11-08 08:41:43

@PankajKhurana - 当你五年前接受答案时，你选择的答案是正确的。今天不再是这种情况了，你能回到这个问题上吗？请把接受的答案改为现代的答案吧？ – Quentin 2014-09-30 20:52:32

其他是aquiring的文件名有没有办法让你了解在JavaScript文件包括其大小的任何其他细节。

相反，您应该配置服务器端脚本来阻止超大的上传。

来源

2009-10-22 12:26:52 AnthonyWJones

另外，即使你可以，你仍然需要一个服务器端检查，因为没有什么能阻止恶意用户写他们自己的表单发布到同一个地方。 – 2009-10-22 12:29:32

以下答案正确无误，这是不正确答案 – 2012-03-29 21:32:00

@DominicRodger我同意你必须检查服务器端的文件大小以确保安全。但为了方便起见（我认为这是OP的目的），最好让用户事先知道他们的1个GiB文件不会被接受，而是在必须等待文件上传后告诉他们。 – 2012-12-14 14:45:35

这可能会使用很多浏览器特定的代码。看看TiddlyWiki的来源，它可以通过挂接到Windows脚本主机（IE），XPCOM（Mozilla）等方式将自己保存在用户的硬盘上。

来源

2009-10-22 12:27:18

我不认为有任何方法用网页上的普通JS来做到这一点。
可能有浏览器扩展，但出于安全原因，JavaScript无法访问文件系统。

Flash和Java应该有类似的限制，但也许它们不太严格。

来源

2009-10-22 12:27:44 Victor

不可能。将允许客户端脚本运行，可以从最终用户硬盘读取文件信息，这是一个主要的安全问题。

来源

2009-10-22 12:29:43

这在Firefox 3.6中受支持。请参阅HTML 5的。我已经使用了该模块，并且它非常适合通过AJAX上传，而不需要任何类型的Flash对象或iframe欺骗。 – Matthew 2010-03-19 04:01:47

对不起，链接显然应该是http://www.w3.org/TR/FileAPI/。 – Matthew 2010-03-19 04:07:21

请参阅http://www.w3.org/TR/FileAPI/。它由Firefox 3.6支持;我不知道其他浏览器。

内onchange事件<input id="fileInput" type="file" />简单的：

var fi = document.getElementById('fileInput'); 
alert(fi.files[0].size); // maybe fileSize, I forget

您还可以返回该文件的内容作为字符串，等等。但是，这可能只适用于Firefox 3.6。

来源

2010-03-19 04:00:23 Matthew

在这里看到：

http://www.kavoir.com/2009/01/check-for-file-size-with-javascript-before-uploading.html

至于所有的人说，这必须做服务器端，它们是绝对现货上它。

在我的情况下，尽管最大尺寸除128Mb，如果用户尝试上传130Mb的东西，他们不应该等待5分钟的上传时间，以找出它太大，所以我需要做为了可用性的缘故，在他们提交页面之前进行额外的检查。

来源

2012-12-14 14:39:05

其中大部分答案都是过时的。目前可以在任何支持File API的浏览器中确定客户端的文件大小。这其中几乎包括除IE9及更早版本以外的所有浏览器。

来源

2013-04-02 17:11:47

现在有可能使用纯JavaScript获取文件大小。几乎所有的浏览器都支持FileReader，您可以使用它来读取文件大小以及无需上载文件到服务器即可显示图像。link

代码：

var oFile = document.getElementById("file-input").files[0]; // input box with type file; 
    var img = document.getElementById("imgtag"); 
    var reader = new FileReader(); 
    reader.onload = function (e) { 
      console.log(e.total); // file size 
      img.src = e.target.result; // putting file in dom without server upload. 

    }; 
    reader.readAsDataURL(oFile);

您可以直接使用下面的代码文件对象中获取文件的大小。

var fileSize = oFile.size;

来源

2013-04-23 07:33:43 Anoop

如何使用简单的Javascript获取文件的上传大小？

回答

相关问题