Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Http and file uploading - How does it really work (under the hood)

Ok this may seem like a bit of a noob question but one many Web developers I know dont have a full understanding of.

Basically how does a file uploading from a web page file input box to a webserver (hosting a .net site for example) with a FileUpload control's uploaded event?

My understanding was that a post was made to the server requesting a stream, which is then passed back to the browser and streaming of the data to the server begins.

My friend says his understanding was that the whole file is encoded into the post request by the browser and the (massive) post is then sent to the server.

I thought this couldn't be the case as if so there would be no way to build an ajax progress bar as the server would not be able to do anything until it had received the entire post by which time it might as well just save the file to its disk.

So how does it actually work from browser to server?

like image 569
Sheff Avatar asked Jun 24 '09 15:06

Sheff


People also ask

How does uploading a file work?

Uploading means data is being sent from your computer to the Internet. Examples of uploading include sending email, posting photos on a social media site and using your webcam. Even clicking on a link on a web page sends a tiny data upload. Downloading means your computer is receiving data from the Internet.

How does HTTP transfer large files?

Send chunked data In version 1.1, HTTP introduced chunked data to help with the large-data cases. When sending a response, the server adds a header Transfer-Encoding: chunked , letting the browser know that data is transmitted in chunks.


2 Answers

Your friend is right. If you want an AJAX progress bar, you have to jump through some hoops.

Usually the technique is to post the upload inside an iframe to an IHttpHandler on the server that stores progress on the server in a server-wide dictionary keyed by an identifier the client makes up and includes in both the AJAX progress request and the upload post. That way, when the client makes the AJAX requests, the server code processing that request can read the value from that dictionary to see how many bytes of the file POST request the server has processed.

Yes, it's complicated :)

like image 87
Jonathan Rupp Avatar answered Oct 13 '22 00:10

Jonathan Rupp


I think your friend is right, the file is encoded into the post sent to the server. If you really want to see exactly how it works, try using Tamper Data in Firefox to view the actual post data.

ETA:

The AJAX style uploads you mention work by doing the post in a hidden iframe, then using AJAX requests to check the upload progress on the server side.

like image 27
Eric Petroelje Avatar answered Oct 12 '22 23:10

Eric Petroelje