Javascript 使用jQuery，在上传之前限制文件大小

在PHP上，他们可以在上传后限制文件大小，但不能在上传前限制。我使用用于我的表单发布，它支持图像文件发布

我想知道是否有一个限制，我可以设置多少字节可以通过AJAX流传输到服务器？这可以允许我检查文件大小，如果文件太大，则返回错误

---

通过在客户端执行此操作，它将阻止那些从Pentax拍摄10MB照片并尝试上载照片的新手。

我认为这是不可能的，除非您使用flash、activex或java上载程序

---

出于安全原因，在上传之前或上传期间，不允许ajax/javascript访问文件流或文件属性。

我遇到了同样的问题。您必须使用ActiveX或Flash（或Java）。好的是它不必是侵入性的。我有一个简单的ActiveX方法，它将返回要上载文件的大小

如果你使用Flash，你甚至可以做一些花哨的js/css来简化上传体验——只使用Flash（作为1x1“电影”）来访问它的文件上传功能。

我发现Apache2（你可能还想检查Apache 1.5）有一种方法可以在上传前通过将其放到.htaccess文件中来限制这一点：

LimitRequestBody 2097152

这将文件上传时限制为2兆字节（2*1024*1024）（如果我正确计算了字节）

注意：执行此操作时，如果表单post或get请求超过此限制，Apache错误日志将生成此条目：

Requested content-length of 4000107 is larger than the configured limit of 2097152

它还将在web浏览器中显示此消息：

<h1>Request Entity Too Large</h1>

---

…并返回一个更优雅的错误结果。

就像其他人所说的那样，仅仅使用JavaScript是不可能的，因为这样的安全模型

如果您能够，我推荐以下解决方案之一。它们都使用flash组件进行客户端验证；但是，它们是使用Javascript/jQuery连接起来的。两者都工作得很好，可以与任何服务器端技术一起使用

---

无法在客户端验证图像大小、宽度或高度。您需要将此文件上载到服务器上，并使用PHP验证所有这些信息。 PHP有一些特殊的函数，如：

getimagesize（）

list（$width、$height、$type、$attr）=getimagesize（“img/flag.jpg”）；
回声“；

我试过这种方法，结果是在IE*中得到的，而Mozilla 3.6.16没有检查旧版本

<img id="myImage" src="" style="display:none;"><br>
<button onclick="findSize();">Image Size</button>
<input type="file" id="loadfile" />
<input type="button" value="find size" onclick="findSize()" />
<script type="text/javascript">
function findSize() {
    if ( $.browser.msie ) {
       var a = document.getElementById('loadfile').value;
           $('#myImage').attr('src',a);
           var imgbytes = document.getElementById('myImage').size;
           var imgkbytes = Math.round(parseInt(imgbytes)/1024);
           alert(imgkbytes+' KB');
    }else {
           var fileInput = $("#loadfile")[0];
           var imgbytes = fileInput.files[0].fileSize; // Size returned in bytes.
           var imgkbytes = Math.round(parseInt(imgbytes)/1024);
                   alert(imgkbytes+' KB');
     }
}    
</script>

图像大小
函数findSize（）{
如果（$.browser.msie）{
var a=document.getElementById（'loadfile'）.value；
$（'#myImage'）.attr（'src'，a）；
var imgbytes=document.getElementById（'myImage'）.size；
var imgkbytes=Math.round（parseInt（imgbytes）/1024）；
警报（imgkbytes+KB'）；
}否则{
var fileInput=$（“#加载文件”）[0]；
var imgbytes=fileInput.files[0]。fileSize；//返回的大小（字节）。
var imgkbytes=Math.round（parseInt（imgbytes）/1024）；
警报（imgkbytes+KB'）；
}
}    

---

同时添加Jquery库。

这是我在一个非常类似的问题中的答案的副本：

---

实际上，您没有访问文件系统的权限（例如，读取和写入本地文件）。但是，由于HTML5文件API规范，您确实可以访问一些文件属性，文件大小就是其中之一

对于此HTML：

<input type="file" id="myFile" />

由于它是HTML5规范的一部分，它只适用于现代浏览器（IE需要v10），我添加了更多关于其他文件信息的详细信息和链接，您应该知道：

---

旧浏览器支持

请注意，旧浏览器将为以前的

this.files

调用返回

null

值，因此访问

this.files[0]

将引发异常，您应该在使用它之前尝试以下代码：

 $(".jq_fileUploader").change(function () {
    var fileSize = this.files[0];
    var sizeInMb = fileSize.size/1024;
    var sizeLimit= 1024*10;
    if (sizeInMb > sizeLimit) {


    }
    else {


    }
  });

var sizeInKB = input.files[0].size/1024; //Normally files are in bytes but for KB divide by 1024 and so on
var sizeLimit= 30;

if (sizeInKB >= sizeLimit) {
    alert("Max file size 30KB");
    return false;
}

---

是的，但是用户仍然必须等待他们的30MB文件被上传，然后才能收到错误。如果你使用flash/activeX，你可以在他们提交页面之前向他们发出警告。这似乎是一个可行的方法，我很确定Flickr使用flash控件来提供一些关于你上传内容的反馈，如果上传内容太大，并且正在进行中。我们使用SWFUpload，虽然不是在积极的开发中，但它已经被证明非常方便且易于集成。首先，感谢您提供的代码。其次，我在这里找到了这段代码：它在Chrome、Firefox或Mac上的Safari中不起作用，任何洞察welcomeThis在你写这个答案时实际上是正确的，但我们现在在HTML5新规范中有了一个文件API：）@Shawnery这不是一个把戏，它只是HTML5文件API的实现，IE10确实支持哪一个：）这个问题太老了，你有足够的时间做出一个很好的描述性回答，也就是说，请给你的代码添加一些解释。我认为它不适用于IE9，文件对象没有大小属性。

//binds to onchange event of your input field
$('#myFile').bind('change', function() {
  //this.files[0].size gets the size of your file.
  alert(this.files[0].size);
});

 $(".jq_fileUploader").change(function () {
    var fileSize = this.files[0];
    var sizeInMb = fileSize.size/1024;
    var sizeLimit= 1024*10;
    if (sizeInMb > sizeLimit) {


    }
    else {


    }
  });

var sizeInKB = input.files[0].size/1024; //Normally files are in bytes but for KB divide by 1024 and so on
var sizeLimit= 30;

if (sizeInKB >= sizeLimit) {
    alert("Max file size 30KB");
    return false;
}