Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>EDIT : before going too far, you may want to check this other answer relying on apache configuration : <a href="https://stackoverflow.com/questions/307679/using-jquery-restricting-file-size-before-uploading#307861">Using jQuery, Restricting File Size Before Uploading</a> . the description below is only useful if you really need even more custom feedback.</p> <p>Yes, you can get some information upfront, before allowing the upload of the whole file.</p> <p>Here's an example of header coming from a form with the <code>enctype="multipart/form-data"</code> attribute :</p> <pre><code>POST / HTTP/1.1 Host: 127.0.0.1:8000 User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.0.3) Gecko/2008092414 Firefox/3.0.3 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 Accept-Language: en-us,en;q=0.7,fr-be;q=0.3 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 300 Connection: keep-alive Content-Type: multipart/form-data; boundary=---------------------------886261531333586100294758961 Content-Length: 135361 -----------------------------886261531333586100294758961 Content-Disposition: form-data; name=""; filename="IMG_1132.jpg" Content-Type: image/jpeg (data starts here and ends with -----------------------------886261531333586100294758961 ) </code></pre> <p>You have the Content-Length in the header, and additionally there is the Content-Type in the header of the file part ( each file has its own header, which is the purpose of multipart encoding ). Beware that it's the browser responsibility to set a relevant Content-Type by guessing the file type ; you can't guarantee it, but it should be fairly reliable for early rejection ( yet you'd better check the whole file when it's entirely available ).</p> <p>Now, there is a gotcha. I used to filter image files like that, not on the size, but on the content-type ; but as you want to stop the request as soon as possible, the same problem arises : <strong>the browser only gets your response once the whole request is sent, including form content and thus uploaded files</strong>.</p> <p>If you don't want the provided content and stop the upload, you have no choice but to brutally close the socket. The user will only see a confusing "connection reset by peer" message. And that sucks, but it's by design.</p> <p>So you only want to use this method in cases of background asynchronous checks ( using a timer that checks the file field ). So I had that hack :</p> <ul> <li>I use jquery to tell me if the file field has changed</li> <li>When a new file is chosen, <em>disable all other file fields on the same form</em> to get only that one.</li> <li>Send the file asynchronously ( jQuery can do it for you, it uses a hidden frame )</li> <li>Server-side, check the header ( content-length, content-type, ... ), cut the connection as soon as you got what you need.</li> <li>Set a session variable telling if that file was OK or not.</li> <li>Client-side, as the file is uploaded to a frame <strong>you don't even get any kind of feedback if the connection is closed</strong>. Your only alternative is a timer.</li> <li>Client-side, a timer polls the server to get a status for the uploaded file. Server side, you have that session variable set, send it back to the brower.</li> <li>The client has the status code ; render it to your form : error message, green checkmark/red X, whatever. Reset the file field or disable the form, you decide. Don't forget to re-enable other file fields.</li> </ul> <p>Quite messy, eh ? If any of you has a better alternative, I'm all ears.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload