webapp - uploading big file in chunks?

Question

I was wondering is it possible to upload a very big file (over 60MB or so..) in small chunks by:

• using javascript to split the file up into small individual files
• concurrently send them to the server side
• use php to merge the small uploaded files together
• finally store them and do something with it..

is this possible?

reason i want to do is to overcome php's restriction of maximum upload filesize available/allowed on my server - i know you can configure php ini and apache stuff but i'm not the administrator and he cannot do that for security reasons within my company..

Answer 1

It's possible, but only in certain browsers. Here's the documentation on the file api . I do not believe IE6-8 support this. Because of that when I needed to do this I had to write the front end that sends the chunks to the server in flash.

Answer 2

As of 2018 there is JavaScript API for this, first you need to slice the file using Blob.slice or its prefix version, then send the chunks using FormData. The server needs to append the chunk to the end of the file, so you will need to remove old file, if exists, before you'll start.

In my project I'm using this code:

Uploader.prototype.upload_by_chunks = function upload_by_chunks(file, path, chunk_size) {
    var self = this;
    chunk_size = chunk_size || 1048576; // 1MB
    var defered = $.Deferred();
    function slice(start, end) {
        if (file.slice) {
            return file.slice(start, end);
        } else if (file.webkitSlice) {
            return file.webkitSlice(start, end);
        }
    }
    var i = 0;
    function process(start, end) {
        if (start < file.size) {
            var chunk = slice(start, end);
            var formData = new FormData();
            formData.append('file', chunk, file.name);
            formData.append('token', self.token);
            formData.append('path', path);
            $.ajax({
                url: 'lib/upload.php?append=1',
                type: 'POST',
                success: function(response) {
                    if (response.error) {
                        self.error(response.error);
                        defered.reject();
                    } else {
                        process(end, end+chunk_size);
                    }
                },
                error: function(jxhr, error, status) {
                    self.error(jxhr.statusText);
                    defered.reject();
                },
                data: formData,
                cache: false,
                contentType: false,
                processData: false
            });
        } else {
            self.leash.terminal.echo('File "' + file.name + '" uploaded.');
            defered.resolve();
        }
    }
    var fname = path + '/' + file.name;
    this.leash.service.unlink(self.token, fname)(function(err, del) {
        if (err) {
            self.error(err);
            defered.reject();
        } else {
            process(0, chunk_size);
        }
    });
    return defered.promise();
};

before I upload by chunks I check this condition:

file.size > self.leash.settings.upload_max_filesize

the constant is taken from php:

$upload_limit = intval(ini_get('upload_max_filesize')) * 1024 * 1024;