jquery-file-upload plugin stuck on infinite loop resending same data after 2GB

Question

Using 'https://github.com/blueimp/jQuery-File-Upload' plugin to upload 4GB file, through 100MB chunks. Examined Client-server interaction, noticed upload is failing after 2GB have been loaded. Examining the firebug console, it appears that the plugin is attempting to re-send the same 100MB chunk at the 2GB content range. I am illustrating the request/response headers below as well as the response received from the server using the default php library provided by the plugin.

The first output represents the 1.8GB - 1.9GB transfer The second output represents the 1.9GB - 2GB transfer. The third output is what happens during the next AJAX request. It appears to attempt to transfer another piece, the server now responds with a slightly different JSON message setting the 'type' attribute to 'multipart/form-data' instead of the usual 'video/mp4' it was returning before. Jquery-file-upload on client will continue to send further AJAX requests to the server with the same range until it is manually stopped.

Server Environment Apache/2.2.22, 'PHP 5.3.10-1ubuntu3.7 with Suhosin-Patch', 'Ubuntu 12.04.1 LTS'.

Client Environment Windows 7, Firefox 24.

ClientSide Javascript Implementation:

<script src="/js/vendor/jquery.ui.widget.js"></script>
<script src="/js/jquery.iframe-transport.js"></script>
<script src="/js/jquery.fileupload.js"></script>

<script>
$(function () {
   'use strict';

    $('#fileupload').fileupload({
     maxChunkSize: 100000000, // 100 MB   */
    url: '/uploadify/jquery_video_upload_submit',
    dataType: 'json',
    done: function (e,data) {
        $.each(data.result.files, function (index, file) {
            $('<p/>').text(file.name).appendTo('#files');
        });
    },
    progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('#progress .progress-bar').css(
            'width',
            progress + '%'
        );
    }
}).prop('disabled', !$.support.fileInput)
    .parent().addClass($.support.fileInput ? undefined : 'disabled');
});
</script>

Server Side Implementation

public function jquery_video_upload_submit(){   
    $this->output->set_header('Content-Type: application/json; charset=utf-8');
    error_reporting(E_ALL | E_STRICT);
    $this->load->library('uploadHandler');
}

Observed Output 1:

Response Headers

Access-Control-Allow-Cred...    false
Access-Control-Allow-Head...    Content-Type, Content-Range, Content-Disposition
Access-Control-Allow-Meth...    OPTIONS, HEAD, GET, POST, PUT, PATCH, DELETE
Access-Control-Allow-Orig...    *
Cache-Control   no-store, no-cache, must-revalidate
Connection  Keep-Alive
Content-Disposition inline; filename="files.json"
Content-Length  204
Content-Type    application/json; charset=utf-8
Date    Mon, 21 Oct 2013 15:02:28 GMT
Keep-Alive  timeout=5, max=93
Pragma  no-cache
Range   0-1899999999
Server  Apache/2.2.22 (Ubuntu)
Vary    Accept
X-Content-Type-Options  nosniff

Request Headers

Accept  application/json, text/javascript, */*; q=0.01
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Content-Disposition attachment; filename="block%20burner%20movie%2011.1.10(1).mp4"
Content-Length  100000211
Content-Range   bytes 1800000000-1899999999/4122624072
Content-Type    multipart/form-data; boundary=---------------------------1694899034803
Cookie  ci_session=****;         
Host    dev.****.tv
Referer http://dev.****.tv/tests/jqueryfileupload
User-Agent  Mozilla/5.0 (Windows NT 6.1; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0
X-Requested-With    XMLHttpRequest

RESPONSE:

{"files":[{"name":"block burner movie 11.1.10(1).mp4","size":1900000000,"type":"video\/mp4","deleteUrl":"http:\/\/dev.****.tv\/?file=block%20burner%20movie%2011.1.10%281%29.mp4","deleteType":"DELETE"}]}

Observed Output 2:

Response Headers

Access-Control-Allow-Cred...    false
Access-Control-Allow-Head...    Content-Type, Content-Range, Content-Disposition
Access-Control-Allow-Meth...    OPTIONS, HEAD, GET, POST, PUT, PATCH, DELETE
Access-Control-Allow-Orig...    *
Cache-Control   no-store, no-cache, must-revalidate
Connection  Keep-Alive
Content-Disposition inline; filename="files.json"
Content-Length  204
Content-Type    application/json; charset=utf-8
Date    Mon, 21 Oct 2013 15:03:27 GMT
Keep-Alive  timeout=5, max=92
Pragma  no-cache
Range   0-1999999999
Server  Apache/2.2.22 (Ubuntu)
Vary    Accept
X-Content-Type-Options  nosniff

Request Headers

Accept  application/json, text/javascript, */*; q=0.01
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Content-Disposition attachment; filename="block%20burner%20movie%2011.1.10(1).mp4"
Content-Length  100000215
Content-Range   bytes 1900000000-1999999999/4122624072
Content-Type    multipart/form-data;   boundary=---------------------------280133237112097
Cookie  ci_session=****
Host    dev.****.tv
Referer http://dev.****.tv/tests/jqueryfileupload
User-Agent  Mozilla/5.0 (Windows NT 6.1; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0
X-Requested-With    XMLHttpRequest

RESPONSE

{"files":[{"name":"block burner movie 11.1.10(1).mp4","size":2000000000,"type":"video\/mp4","deleteUrl":"http:\/\/dev.****.tv\/?file=block%20burner%20movie%2011.1.10%281%29.mp4","deleteType":"DELETE"}]}

Observed Output 3:

Response Headers

Access-Control-Allow-Cred...    false
Access-Control-Allow-Head...    Content-Type, Content-Range, Content-Disposition
Access-Control-Allow-Meth...    OPTIONS, HEAD, GET, POST, PUT, PATCH, DELETE
Access-Control-Allow-Orig...    *
Cache-Control   no-store, no-cache, must-revalidate
Connection  close
Content-Disposition inline; filename="files.json"
Content-Length  266
Content-Type    application/json; charset=utf-8
Date    Mon, 21 Oct 2013 15:04:26 GMT
Pragma  no-cache
Range   0-1999999999
Server  Apache/2.2.22 (Ubuntu)
Vary    Accept
X-Content-Type-Options  nosniff

Request Headers

Accept  application/json, text/javascript, */*; q=0.01
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Content-Disposition attachment; filename="block%20burner%20movie%2011.1.10(1).mp4"
Content-Length  100000213
Content-Range   bytes 2000000000-2099999999/4122624072
Content-Type    multipart/form-data; boundary=---------------------------23653531328930
Cookie  ci_session=****
Host    dev.****.tv
Referer http://dev.****.tv/tests/jqueryfileupload
User-Agent  Mozilla/5.0 (Windows NT 6.1; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0
X-Requested-With    XMLHttpRequest

RESPONSE

{"files":[{"name":"block burner movie 11.1.10(1).mp4","size":2000000000,"type":"multipart\/form-data; boundary=---------------------------23653531328930","deleteUrl":"http:\/\/dev.****.tv\/?file=block%20burner%20movie%2011.1.10%281%29.mp4","deleteType":"DELETE"}]}

stuck at 2gig would suggest your client is on a 32bit platform, which generally have a 2.1gig (2^31-1) byte filesize limit on such things. — Marc B
– Marc B, Commented Oct 21, 2013 at 20:42
There is a 2GB limitation somewhere, but client is running Windows 7, 64bit, user agent string confirms this with 'WOW64'. I checked Firefox, however they do not make a specific 32/64 bit versions for Windows according to support.mozilla.org/en-US/questions/954794 — Barthalameu James Simpson
– Barthalameu James Simpson, Commented Oct 21, 2013 at 21:28
wow64 means it's the 32bit emulation layer for a 64bit system, e.g. it's a 32bit firefox that happens to be running on a 64bit windows. so yeah... windows might be 64bit, but firefox is still stuck in 32bit-land and all its attendant limits. — Marc B
– Marc B, Commented Oct 21, 2013 at 21:30
Hi Marc, I created a new VM in AWS, and tested Chrome, IE 10, and Firefox. Chrome and IE10 worked fine, Firefox died at a random 1.4GB. I was measuring CPU/Memory and noticed that Firefox was using resources excessively. With Firefox, I am using 'Firebug' to review the request and response headers, when I turned this off, Firefox completed SUCCESSFULLY!!! It appears that you are correct in that there is a limit in the browser, specifically in the Firebug ADD ON, it cannot handle the large files. I am going to continue to test on the original client and repeat all of these tests. — Barthalameu James Simpson
– Barthalameu James Simpson, Commented Oct 22, 2013 at 5:13

Barthalameu James Simpson · Accepted Answer · 2013-10-28 20:37:58Z

1

It appears that this is a Firefox Firebug issue. Firebug will respond in unpredictable ways if you try to load large +2GB files as blobs and try to slice them. Turning Firebug off before running the tests works fine, in that Firefox is able to consume large files (+4GB) and slice them (into chunks) without any problems.

answered Oct 28, 2013 at 20:37

Barthalameu James Simpson

115 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery-file-upload plugin stuck on infinite loop resending same data after 2GB

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related