Html 5 File upload [closed]

Question

I've been trying to get Html 5 file uploading to work. I just don't seem to "get it". So rather than tell you about all the problems I'm facing I was wondering if someone has already nicked this in the bud and would be willing to help.

Nice to have features would be 1. File upload progress 2. Time left 3. Some sort of confirmation once upload has completed

Answer 1

Uploading large file is equal to grabbing maximum resources from CPU and putting the user agent in block state, so we need to avoid these two things, for that we have to upload the large file as multiple parts(chunks), so we have to slice the file and we have to upload in background.

HTML5 introduced some APIs, useful APIs for uploading large file are webworkers and File API. These two are helpful while uploading large file, we have to upload slice the file at client side to make the file as chunks then we need to upload at background to increase the performance of CPU.

For slicing the File API has slice call

var chunk=file.webkitSlice(start,stop)||file.mozSlice(start,stop);

we have to process the uploading in background Using Webworkers to free the user agent.

var worker=new worker('worker.js');
worker.postMessage(FileList);

Answer 2

I have a blog post that goes through the whole process of explaining Html5 file upload and there is also a working example, that is a page you can upload a file and see it all in action.

Html5 File Upload with Progress