Upload und Download Monitor für AJAX mit Progressbar

Das XHR Objekt kann mit einer ProgressBar kommunizieren und den Fortschritt für Upload (Request) wie Download (Response) unabhängig voneinander monitoren

Hinweis: Serverseitig wird die hochgeladene Datei nicht gespeichert sondern einfach nur zurückgesendet. Somit kann das XHR-Objekt den Fortschritt beider Stream-Prozesse unabhängig voneinander darstellen.

Upload/Request
Download/Response

Serverseitig darf die Übertragung nicht mit Transfer-Encoding: chunked erfolgen. Das relevante Stück JavaScript sieht so aus:

    xhr.upload.onprogress = function(e) {
        if (e.lengthComputable) {
            document.getElementById('upload').value = (e.loaded / e.total) * 100;
        }
    };
    xhr.onprogress = function(e) {
        if (e.lengthComputable) {
            document.getElementById('download').value = (e.loaded / e.total) * 100;
        }
    };

Anbieter: nmq​rstx-18­@yahoo.de, die Seite verwendet funktionsbedingt einen Session-Cookie und ist Bestandteil meines nach modernen Aspekten in Perl entwickelten Frameworks.