Preloader / Thread - beides funktioniert nicht wie erhofft...

  • Ab sofort steht euch hier im Forum die neue Add-on Verwaltung zur Verfügung – eine zentrale Plattform für alles rund um Erweiterungen und Add-ons für den DSM.

    Damit haben wir einen Ort, an dem Lösungen von Nutzern mit der Community geteilt werden können. Über die Team Funktion können Projekte auch gemeinsam gepflegt werden.

    Was die Add-on Verwaltung kann und wie es funktioniert findet Ihr hier

    Hier geht es zu den Add-ons

Status
Für weitere Antworten geschlossen.

springboy69

Benutzer
Registriert
10. Jan. 2010
Beiträge
8
Reaktionspunkte
0
Punkte
7
Hallo zusammen,

für meinen Verein habe ich in letzter Zeit eine Bestellseite für Vereinsbekleidung etc. entwickelt. Erstellt in PHP mit MySQL Anbindung...

Folgender Ablauf:
User wählt auf der Seite die Ware die er haben möchte (Anzahl, Größe, etc.) Klickt anschließend auf "Bestellen". Nun werden die Datensätze in eine Temporäre Bestellsiste geschrieben und zur Bestätigung nochmals angezeigt. Der User hat dann die Möglichkeit die Bestellung zu stornieren (Temp-Liste wird gelöscht) oder die Bestellung zu bestätigen (Datensätze werden von Temp-Liste in Bestell-Liste verschoben).
Bei der Bestellbestätigung wird anschließend via 'tcpfd' ein PDF-Dokument mit den bestellten Waren erstellt und auf dem Server gespeichert. Danach wird das PDF-Dokument per Mail an den User gesendet.

Grundsätzlich funktioniert alles wie gewollt. Nur das Erstellen und versenden des PDF-Dokuments dauert so ca. 3-4 Sekunden. Während dieser Zeit kann der User denken dass das Programm abgestürzt ist etc...
Nun wollte ich als Userfeedback das mittels Preloader lösen. Hier einmal der Code einer Testseite die das ganze simulieren soll.

PHP:
<!doctype html>
<html lang="en">

<head>
      <meta charset="utf-8"/>
      <title>PreLoadMe</title>

      <!-- Please support http://humanstxt.org/ -->
      <link type="text/plain" rel="author" href="http://www.gerbers.ch/humans.txt"/>

      <!-- Stylesheet -->
      <link rel="stylesheet" href="css/styles_ajax.css" type="text/css"/>
</head>

<body>
<!-- Preloader -->
<div id="preloader">
    <div id="status">&nbsp;</div>
</div>

<!-- jQuery Plugin -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Preloader -->
<script type="text/javascript">
    $(window).on('load', function() { // makes sure the whole site is loaded
        $('#status').delay(500).fadeOut('slow'); // will first fade out the loading animation
        $('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website.
        $('body').delay(350).css({'overflow':'visible'});
    })
</script>

<!-- My Website Content -->
<?php
    // Verbindung zu MySQL Server
    require ('mysql_connect.php');
    
    // Datensätze auslesen (Beispiel)
    $sql = "SELECT * FROM `2016-04_Polo`";
    $result = mysqli_query($connection, $sql);
    $num = mysqli_num_rows($result);
    $lfdNr = 1;
    while($row = mysqli_fetch_array($result)) {
        $myHtml .= "(".$lfdNr.") ID= ".$row['id']."; Vorname = ".$row['Vorname']."<br />";
        $lfdNr++;
        usleep(200000);
    }
    echo $myHtml;
    mysqli_close($connection);
?>

</body>
</html>

mit der dazu gehörigen CSS:

CSS:
@charset "utf-8";

/* Preloader */
#preloader {
    position:fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color:#fff; /* change if the mask should have another color then white */
    z-index:99; /* makes sure it stays on top */
}

#status {
    width:200px;
    height:200px;
    position:absolute;
    left:50%; /* centers the loading animation horizontally one the screen */
    top:50%; /* centers the loading animation vertically one the screen */
    background-image:url(../img/status.gif); /* path to your loading animation */
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px; /* is width and height divided by two */
}

Die MySQL Abfrage liefert 15 Datensätze. Somit habe ich über usleep eine Verweildauer von 3 Sekunden.
Erst im Anschluss startet das GIF des Preloaders für kurze Zeit bevor die Datensätze angezeigt werden.

Nach etwas Recherche im Netz habe ich nun auch herausgefunden warum das so ist. PHP --> Serverseitiges Script; JS --> Clientseitig.
Somit wohl für mich nicht umsetzbar...

Dann kam mir die nächste Idee: Einfach das lange andauernde erstellen des PDF-Files in einen separaten Thread. Macht ja grundsätzlich nichts für den User, wenn das Dokument ein paar Sekunden später via Mail versendet wird. Die Rückmeldung am Browser hat er zumindest gleich.

Also Testfile erstellt:

PHP:
<?php

class workerThread extends Thread {
public function __construct($i){
  $this->i=$i;
}

public function run(){
  while(true){
   echo $this->i;
   sleep(1);
  }
}
}

for($i=0;$i<50;$i++){
$workers[$i]=new workerThread($i);
$workers[$i]->start();
}

?>

Ergebnis:
Code:
Fatal error: Uncaught Error: Class 'Thread' not found in /volume1/web/test/thread.php:4 Stack trace: #0 {main} thrown in /volume1/web/test/thread.php on line 4

Offensichtlich ist die Klasse Thread auf meiner Syno nicht installiert.

Nun bin ich mit meinen Ideen etwas am Ende.
Hat jemand einen Tipp für mich wie ich das Problem mit dem Preloader lösen kann oder gibt es eine für Konsolen-Laien verständliche Anleitung wie die Klasse Threads nachträglich hinzugefügt werden kann?

Bin für jeden Tipp dankbar.
Danke schon einmal im Voraus.
 
Threads sind glaube nur für die Benutzung via CLI möglich, nicht via Webserver Kontext.
http://php.adamharvey.name/manual/en/book.pthreads.php
Ob/wie man eventuell eine Aufgabe vom Webserver an phpcli outsourcen kann weißt du eventuell besser als ich.

Ansonsten wieso nicht eine einfache Lösung und einfach einen Texthinweis oder ähnlich an den Benutzer, dass die Ausgabe der nächsten Seite 5 Sekunden dauern kann, oder ähnlich?
 
Status
Für weitere Antworten geschlossen.
 

Kaffeautomat

Wenn du das Forum hilfreich findest oder uns unterstützen möchtest, dann gib uns doch einfach einen Kaffee aus.

Als Dankeschön schalten wir deinen Account werbefrei.

:coffee:

Hier gehts zum Kaffeeautomat