[PHP] Fortschritt einer foreach-Schleife darstellen

lima-city → Forum → Programmiersprachen → PHP, MySQL & .htaccess

Autor dieses Themas
biberiusmero

biberiusmero hat kostenlosen Webspace.

22:44, 27.8.2015
Hallo zusammen,

ich arbeite momentan an einem ref="/tag/projekt">Projekt, bei dem der Nutzer durch Klick auf einen Button eine foreach-Schleife auslöst, die Thumbnails von Bildern auf dem Server erstellt.
Da das ein wenig dauert, wäre es schön, den Fortschritt mit einer progressBar darzustellen. Geht das evtl. mit AJAX wie bei Fileuploads?

Vielen Dank im Voraus

biberiusmero
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage
muellerlukas

muellerlukas hat kostenlosen Webspace.

22:48, 27.8.2015
Ich würde dir da eher raten pro Bild einen Aufruf zu starten, das macht es dir mit Ajax auch recht einfach.
Bei einem Aufruf kannst du da ganz schnell an Scriptlimits stoßen.

Autor dieses Themas

13:48, 31.8.2015

OK, ich hab jetzt eine PHP-Datei, die per POST den Dateinamen einer Bilddatei empfängt und dann dazu das Thumbnail erstellt:

<?php
$file_directory = '../files';
$thumbnail_directory = '../image-thumbnails';

if(isset($_POST["thumbnailer-file"]))
{
    $thumbnailer_file = $file_directory . '/' . $_POST["thumbnailer-file"];
    if(file_exists($thumbnailer_file))
    {
        $imagesize = getimagesize($thumbnailer_file);
        $imagetype = $imagesize[2];
        switch($imagetype)
        {
            case 1: //GIF
                $image = @imagecreatefromgif($thumbnailer_file);
                $is_supported_image = TRUE;
                break;
            case 2: //JPEG
                $image = @imagecreatefromjpeg($thumbnailer_file);
                $is_supported_image = TRUE;
                break;
            case 3: //PNG
                $image = @imagecreatefrompng($thumbnailer_file);
                $is_supported_image = TRUE;
                break;
            default:
                $is_supported_image = FALSE;
        }
        if($is_supported_image)
        {
            $res = CreateThumbnail(...);
            if($res == 'created')
            {
                echo 'success';
            }
            else
            {
                echo 'fail';
            }
        }
    }
}
function CreateThumbnail(...)
{
    ...
}
?>

Diese soll dann von JavaScript für jedes Bild neu aufgerufen werden und zeitgleich soll der Fortschritt dargestellt bzw. aktualisiert werden. Die Thumbnails werden zwar erstellt, aber das mit dem Fortschritt klappt noch nicht.

function createThumbnails() {
    //PHP gibt hier ein Array zurück, in dem die Dateinamen der Bilder stehen, von denen ein Thumbnail erstellt werden soll
    var thumbnailerFiles = <?php echo json_encode(GetThumbnailerImages()); ?>;
    var percent = 0;
    if(thumbnailerFiles.length != 0) {
       var percentIncreasePerImage = Math.round((1 / thumbnailerFiles.length) * 100);
    }
    for(var i = 0; i < thumbnailerFiles.length; i++) {
        var formdata = new FormData();
        formdata.append("thumbnailer-file", thumbnailerFiles[i]);
        var ajax = new XMLHttpRequest();
        ajax.open("POST", "thumbnailer.php");
        ajax.send(formdata);
        percent += percentIncreasePerImage;

        //hier wir die progressBar verändert
        document.getElementById("progressBar").value = percent;
    }
    document.getElementById("progressBar").value = 0;
}

Muss man evtl. die progressBar an einer anderen Stelle verändern oder funktioniert das so gar nicht?

MfG biberiusmero

fuerderer

fuerderer hat kostenlosen Webspace.

14:31, 31.8.2015

Dein Javascript sendet im Moment alle Requests direkt nacheinander und überflutet den Server mit Anfragen. Die Antworten des Servers auf all die Anfragen werden am Ende einfach ignoriert.
Schicke besser erstmal nur einen Request und warte auf die Antwort. Ist die Antwort nicht 'success' kannst du noch einen Hinweis ausgeben. In jedem Fall wird erst danach dann der nächste Request gesendet.

function createThumbnails() {
    //PHP gibt hier ein Array zurück, in dem die Dateinamen der Bilder stehen, von denen ein Thumbnail erstellt werden soll
    var thumbnailerFiles = <?php echo json_encode(GetThumbnailerImages()); ?>;
    var percent = 0;
    if(thumbnailerFiles.length != 0) {
       var percentIncreasePerImage = Math.round((1 / thumbnailerFiles.length) * 100);
    }
    // Bis hier hab ich alles stehen lassen.
 
    var createThumbnail=function(i) {
        var formdata = new FormData();
        formdata.append("thumbnailer-file", thumbnailerFiles[i]);
        var ajax = new XMLHttpRequest();
        ajax.onreadystatechange=function() {
            if (ajax.readyState == 4) {
                var erfolg=(ajax.status==200 && ajax.responseText=='success');
                if (!erfolg) {
                    // Gib einen Hinweis aus
                }
 
                percent += percentIncreasePerImage;
                //hier wir die progressBar verändert
                document.getElementById("progressBar").value = percent;
 
                // Und der nächste Aufruf
                i++;
                if (i<thumbnailerFiles.length) {
                    createThumbnail(i);
                }
            }
        }
        ajax.open("POST", "thumbnailer.php");
        ajax.send(formdata);
    }
    document.getElementById("progressBar").value = 0;
    createThumbnail(0);
}

Brauchst du innerhalb von Javascript noch eine Rückmeldung, wann alle Thumbnails fertig erstellt wurden? Dann erweitere ich dir das Programm, das sind praktisch nur zwei Zeilen mehr.

Autor dieses Themas
biberiusmero

biberiusmero hat kostenlosen Webspace.

17:21, 31.8.2015
Hallo fuerderer,

vielen Dank für deine Antwort, so hat's geklappt. Die Rückmeldung nach Fertigstellung wäre praktisch, dann könnte ich die progressBar dann wieder auf null setzen.

MfG biberiusmero

P. S.: Wie stellst du deinen Code dar? Gibt's da einen neuen Sytax-Highlighter von lima-city?

fuerderer

fuerderer hat kostenlosen Webspace.

17:56, 31.8.2015

biberiusmero schrieb:
Die Rückmeldung nach Fertigstellung wäre praktisch, dann könnte ich die progressBar dann wieder auf null setzen

Ok, dann bau ich das noch kurz um ...

function createThumbnails(callback) {
    //PHP gibt hier ein Array zurück, in dem die Dateinamen der Bilder stehen, von denen ein Thumbnail erstellt werden soll
    var thumbnailerFiles = <?php echo json_encode(GetThumbnailerImages()); ?>;
    var percent = 0;
    if(thumbnailerFiles.length != 0) {
       var percentIncreasePerImage = Math.round((1 / thumbnailerFiles.length) * 100);
    }
    // Bis hier hab ich alles stehen lassen.
  
    var createThumbnail=function(i) {
        var formdata = new FormData();
        formdata.append("thumbnailer-file", thumbnailerFiles[i]);
        var ajax = new XMLHttpRequest();
        ajax.onreadystatechange=function() {
            if (ajax.readyState == 4) {
                var erfolg=(ajax.status==200 && ajax.responseText=='success');
                if (!erfolg) {
                    // Gib einen Hinweis aus
                }
  
                percent += percentIncreasePerImage;
                //hier wir die progressBar verändert
                document.getElementById("progressBar").value = percent;
  
                // Und der nächste Aufruf
                i++;
                if (i<thumbnailerFiles.length) {
                    createThumbnail(i);
                } else {
                    callback();
                }
            }
        }
        ajax.open("POST", "thumbnailer.php");
        ajax.send(formdata);
    }
    document.getElementById("progressBar").value = 0;
    createThumbnail(0);
}

Jetzt musst du diese Funktion nur noch richtig aufrufen :biggrin:

createThumbnails(function() {
    // Die Thumbnails sind jetzt alle erstellt.
});

biberiusmero schrieb:
P. S.: Wie stellst du deinen Code dar? Gibt's da einen neuen Sytax-Highlighter von lima-city?

Nein, neu ist er nicht. Aber es kennen ihn nicht alle. Auf dieser alten Hilfeseite von Lima-city ist erklärt, wie man ihn benutzen kann.

Autor dieses Themas
biberiusmero

biberiusmero hat kostenlosen Webspace.

18:54, 31.8.2015
OK, vielen Dank für die schnelle Hilfe!

MfG biberiusmero
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

lima-city bietet dir kostenlosen und werbefreien Speicherplatz für Deine Homepage. Sofort anmelden und direkt loslegen mit Webspace, PHP, Datenbanken, günstigen Domains und einer tollen Community!

kostenloser Webspace werbefrei: lima-city