cubiclesoft / jquery-fancyfileuploader

A jQuery plugin to convert the HTML file input type into a fancy file uploader under a MIT or LGPL license. Mobile-friendly too!
58 stars 27 forks source link

Issue with chunked uploads? #28

Open purplealert opened 2 years ago

purplealert commented 2 years ago

Many thanks for this uploader, your work is much appreciated.
I have been able to setup the uploader and have it work but when I try and enable chunked uploads in order to deal with large uploads, I am running into problems.

I have setup the chunk size in the script:

fileupload : { maxChunkSize : 1000000 }

I can see the file being uploaded OK but watching the destination directory shows that the chunks are always overwritten rather than being appended. Once it finishes I'm left with the last, under 10MB, chunk only.

I'm using your helper script at the server, which looks like it can handle chunks but I assume that I'm missing something I need to tell it to append to the upload in progress rather than overwrite? Your script is handling the moving of the file from the temp location to the destination so I thought it would also handle the append?

Any assistance you can offer would be gratefully received.

cubiclesoft commented 2 years ago

Chunk uploads require specific HTTP headers to be sent by the browser and received by PHP: Content-Disposition with an attachment and either Content-Range or Range. When those headers exist, the file is appended to, otherwise it is overwritten.

Verify that your browser is sending the correct headers and that PHP is also receiving them. If, for example, PHP is behind a load balancer/web proxy, the headers might be received by the proxy but not get passed on from the proxy to PHP. As a result, PHP will overwrite rather than append.

purplealert commented 2 years ago

Thanks for coming back to me. I have saved the responses from the system when I started debugging why it wasn't working as I expected, the relevant parts of the $_SERVER string available to PHP gives me the following, for example:

`[HTTP_CONTENT_DISPOSITION] => attachment; filename=&#34video.mp4"

[HTTP_CONTENT_RANGE] => bytes 120000000-129999999/137012490

[HTTP_CONNECTION] => keep-alive

[HTTP_X_REQUESTED_WITH] => XMLHttpRequest

[CONTENT_LENGTH] => 10000744`

This server isn't behind any proxy/lb and it looks like these headers are being set properly but it's still overwriting each chunk. The upload completes properly, according to the browser, it's just that I only ever get the last chunk of the file after completion?

purplealert commented 2 years ago

I'm following up myself here as I've been looking deeper into this. It appears that the function GetChunkFilename doesn't like the fact that the quotes are encoded as " so it returns false and the range check function never gets called. Despite what I shows in the previous message, the encoded values are at both ends of the filename.

As a quick and dirty fix I have decoded the [HTTP_CONTENT_DISPOSITION] within the GetChunkFilename function:

$str = html_entity_decode($_SERVER["HTTP_CONTENT_DISPOSITION"], ENT_QUOTES );

and now the filename is returned properly and the file uploads successfully. I'm not entirely sure why the quotes in this instance are html entities? Could be a browser quirk or something to do with the platform I'm using, I'll see if I can work out what's causing that.

Is it safe to decode the content disposition string like that or is there a better fix I should be using? Thanks for pointing me in the right direction.