Próbowałem utworzyć panel przesyłania bez pamięci flash, który pokazuje także pasek postępu. Na naszym serwerze mamy PHP 5.3 (na razie nie można uaktualnić do wersji 5.4, więc nie można użyć nowej funkcji przesyłania danych =>http://php.net/manual/en/session.upload-progress.php). Nie możemy używać rozwiązań opartych na pamięci flash, rozszerzeń lub podobnych.

Dlatego próbowałem użyć XMLHttpRequest w połączeniu z AJAX. Problem polega na tym, że osiągnąłem tylko częściowy sukces.

Udało mi się załadować i zapisać na serwerze plik o rozmiarze około 380 MB, jednak podczas próby z większym plikiem, takim jak 4 GB, nie zostanie on zapisany na serwerze (jeśli sprawdzę w Firebug w jednym momencie, powiedz „POST przerwany”).

Inną dziwną rzeczą jest to, że przy tym samym pliku xhr.upload.loaded zaczyna się od tego samego wymiaru xhr.upload.total i zaczyna się od tego liczyć.

Czy ktoś wie, jak rozwiązać ten problem lub ma alternatywne rozwiązanie?

Kod klienta to:

<code><script type="application/javascript" src="jquery.js"></script>

<script type="application/javascript">

function uploadToServer()
{
    fileField = document.getElementById("uploadedFile");
    var fileToUpload = fileField.files[0]; 

    var xhr = new XMLHttpRequest();
    var uploadStatus = xhr.upload;

    uploadStatus.addEventListener("progress", function (ev) {
            if (ev.lengthComputable) {
                $("#uploadPercentage").html((ev.loaded / ev.total) * 100 + "%");
            }
        }, false);

    uploadStatus.addEventListener("error", function (ev) {$("#error").html(ev)}, false);
    uploadStatus.addEventListener("load", function (ev) {$("#error").html("APPOSTO!")}, false);

    xhr.open(
            "POST",
            "serverUpload.php",
            true
            );
        xhr.setRequestHeader("Cache-Control", "no-cache");
        xhr.setRequestHeader("Content-Type", "multipart/form-data");
        xhr.setRequestHeader("X-File-Name", fileToUpload.fileName);
        xhr.setRequestHeader("X-File-Size", fileToUpload.fileSize);
        xhr.setRequestHeader("X-File-Type", fileToUpload.type);
        //xhr.setRequestHeader("Content-Type", "application/octet-stream");
        xhr.send(fileToUpload);
}



$(function(){

    $("#uploadButton").click(uploadToServer);

});


</script>
</code>

Część HTML:

<code><form action="" name="uploadForm" method="post" enctype="multipart/form-data">

  <input id="uploadedFile" name="fileField" type="file" multiple />

<input id="uploadButton" type="button" value="Upload!">

</form>

<div id="uploadPercentage"></div>
<div id="error"></div>
</code>

Kod po stronie serwera:

<code><?php

$path = "./";
$filename = $_SERVER['HTTP_X_FILE_NAME'];
$filesize = $_SERVER['CONTENT_LENGTH'];


$file = "log.txt";
$fo= fopen($file, "w");
fwrite($fo, $path . PHP_EOL);
fwrite($fo, $filename . PHP_EOL);
fwrite($fo, $filesize . PHP_EOL);
fwrite($fo, $path . $filename . PHP_EOL);

file_put_contents($path . $filename, 
file_get_contents('php://input')
);

?>
</code>