Check file size before upload

Question

I am using this javascript that I got from here  and it works perfectly for what I need it to   var  validFileExtensions      jpg     jpeg      function File Validator theForm       var arrInputs   theForm getElementsByTagName  input         for  var i   0  i  lt  arrInputs length  i           var oInput   arrInputs i        if  oInput type     file              var sFileName   oInput value           var blnValid   false               for  var j   0  j  lt   validFileExtensions length  j                       var sCurExtension    validFileExtensions j                    if  sFileName substr sFileName length - sCurExtension length  sCurExtension length  toLowerCase      sCurExtension toLowerCase                           blnValid   true                       break                                                              if   blnValid                         alert  Invalid image file type                          return false                                         return true        Now  I was wondering if  in addition  I could check the file size and fail if the file is bigger than 500kb -  all before pressing the submit upload button   EDIT  After looking into what PHPMyCoder suggested  I end up solving by using this javascript code    lt script language  JavaScript  gt  function checkFileSize inputFile    var max    3   512   512     786MB  if  inputFile files  amp  amp  inputFile files 0  size  gt  max        alert  File too large        Do your thing to handle the error      inputFile value   null     Clear the field          lt  script gt    This checks the file size  and alert the user before submitting the form

User · Answer

I created a jQuery version of PhpMyCoder s answer      form   submit function  e             if       file   0  files 0  size  lt  10485760  amp  amp  get extension     file   val        jpg         10 MB  this size is in bytes            Prevent default and display error         alert  File is wrong type or over 10Mb in size             e preventDefault               function get extension filename        return filename split      pop   toLowerCase

User · Answer

Client side Upload Canceling  On modern browsers  FF    3 6  Chrome    19 0  Opera    12 0  and buggy on Safari   you can use the HTML5 File API  When the value of a file input changes  this API will allow you to check whether the file size is within your requirements  Of course  this  as well as MAX FILE SIZE  can be tampered with so always use server side validation    lt form method  post  enctype  multipart form-data  action  upload php  gt       lt input type  file  name  file  id  file    gt       lt input type  submit  name  submit  value  Submit    gt   lt  form gt    lt script gt  document forms 0  addEventListener  submit   function  evt         var file   document getElementById  file   files 0        if file  amp  amp  file size  lt  10485760       10 MB  this size is in bytes            Submit form               else             Prevent default and display error         evt preventDefault             false    lt  script gt    Server Side Upload Canceling  On the server side  it is impossible to stop an upload from happening from PHP because once PHP has been invoked the upload has already completed  If you are trying to save bandwidth  you can deny uploads from the server side with the ini setting upload max filesize  The trouble  with this is this applies to all uploads so you ll have to pick something liberal that works for all of your uploads  The use of MAX FILE SIZE has been discussed in other answers  I suggest reading the manual on it  Do know that it  along with anything else client side  including the javascript check   can be tampered with so you should always have server side  PHP  validation   PHP Validation  On the server side you should validate that the file is within the size restrictions  because everything up to this point except for the INI setting could be tampered with   You can use the   FILES array to find out the upload size   Docs on the contents of   FILES can be found below the MAX FILE SIZE docs   upload php   lt  php if isset   FILES  file           if   FILES  file    size    gt  10485760      10 MB  size is also in bytes             File too big       else              File within size restrictions

User · Answer

JavaScript running in a browser doesn t generally have access to the local file system   That s outside the sandbox   So I think the answer is no

[php] Check file size before upload

Examples related to php

Examples related to javascript

Examples related to file-upload

Examples related to image-uploading

Examples related to filesize