Seite Aktualisieren

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

rschmidt

Neues Mitglied
26 Januar 2017
4
0
1
22
Hallo zusammen,

ich habe da mal eine Frage...
(Eigentlich möchte ich diese Frage sogar in zwei Teile teilen, wenn Ihr erlaubt...;) )

Es geht dabei um eine relativ einfach Anwendung, die Ergebnisse zu einer Sportveranstaltung bereitstellt.
Dabei sieht der Unterbau wie folgt aus: Alle Ergebnisse und auch Teilergebnisse (z.B. von einzelnen Streckenabschnitten) werden zum Teil Manuell aber per RFID erfasst und in eine MySQL Datenbank geschrieben. Die Ergebnisse werden dabei mit einem maximalen Zeitversetzt von 10 Sekunden an die Datenbank übertragen. Sprich wir haben dabei dann die Daten schon fast Live vorliegen. Diese Daten sollen dann die Zuschauer und Teilnehmer präsentiert werden. Dazu haben ich eine kleine Webbasierte Anwendung, die die Daten aus der Datenbank anzeigt.
Da die Daten sich laufend ändern, soll natürlich die Anwendung sich auch ständig aktualisieren.
Bisher hab ich dafür den einfachsten Weg gewählt und im Header einfach <meta http-equiv="refresh" content="20"; url="/index.php" /> stehen

Dafür muss es aber doch eigentlich eine Bessere Lösung geben, als alle 20 bzw. 10 Sekuden die ganze Seite neu zuladen.

Bei meiner Suche, bin ich dann über eine Möglichkeit mit Javascript gestoßen:
https://crunchify.com/how-to-refresh-div-content-without-reloading-page-using-jquery-and-ajax/
Allerdings, müssen die Daten ja neu aus der Datenbank abgefragt werden?

Hat da jemand einen Tipp für mich, wie man das abbildet?
Sprich die Seite wird einmal geladen und nur die Tabelle wird alle 20 Sekunden neu geladen?

Der Zweite Teil der Frage zielt in die gleiche richtig:
Aus unterschiedlichen Teilbereichen, kam in den letzten Jahren immer wieder der Wunsch, eine Statusseite für diesen Berech zu bekommen. Die Zeitnehmer hätten gerne einen Status ob die Systeme alle laufen, die Moderation hätte gerne eine Seite auf die aktuellen Infos, wie Zieleinläufe, Startgruppen, aktuelle Ränge etc. zusammengefasst stehen, die Wettkampfleitung braucht eine Status zu den Strecken (sind die Strecken frei oder sind noch Teilnehmer unterwegs, etc), die Bereichskoordinatoren brauchen eine Übersicht über den Check-In. usw.

Daher habe ich für die Wünsche entsprechende Seiten entwinkelt, die genau die Daten aus der Datenbank lesen und übersichtlich darstellen, für den Bereich der gerade gebraucht wird.
Auch diese Seiten müssen sich natürlich regelmäßig aktualisieren.
Dabei kommt hier aber eine Schwierigkeit dazu: Z.B. die Wettkampfleitung oder auch die Zeitnehmer haben in Ihrer Statusseite IFrames eingebunden die nicht mit aktualisiert werden sollten. Da gibt es z.B. eine Webcam oder die Uhr der PTB (https://uhr.ptb.de/) . Wenn die Seite refresht wird, dauert es immer einige Sekunden, bis die IFrames wieder zur Verfügung stehen, was natürlich nervt wenn die Seite alles 20 Sekunden aktualisiert wird.

Hat jemand einen Tipp für mich, wie ich diese 1 1/2 Probleme eleganter lösen kann?

Vielen Dank im Vorraus.
 

Tronjer

Moderator
Team
Moderator
8 Oktober 2010
5.109
438
83
Berlin
Hat da jemand einen Tipp für mich, wie man das abbildet?
Sprich die Seite wird einmal geladen und nur die Tabelle wird alle 20 Sekunden neu geladen?
Ein setInterval mit einem $.ajax, das alle 20 s einen GET Request an die Datenbank sendet.

Dass der Browser nach Updates sucht und dabei sinnlose Requests sendet, ist aber nicht mehr zeitgemäß. Dafür gibt es Cloud-Services, welche die Clients bei Änderungen in der Datenbank automatisch updaten.
https://firebase.google.com
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.046
204
63
18
Die Kosten aber was @Tronjer oder haben nur eine Begrenzte Anzahl an Interaktionen. PouchDB/CouchDB liefert so einen Service glaube ich und sind ebenfalls JSON-Datenbanken. Websockets währen auch eine Alternative (wobei Websockets sehr Anspruchsvoll für Server sind).
 

Tronjer

Moderator
Team
Moderator
8 Oktober 2010
5.109
438
83
Berlin
Websockets wären schon eine Alternative, erfordern allerdings einen NodeJS Server. Aber auch in dem Fall müsste man seinen Backend Stack alleine erstellen.

@Aaron3219
Ich verwende Firebase bevorzugt im Entwicklungsprozess, weil es eine unkomplizierte API bietet und konfiguriere meine Services so, dass diese sich mit wenig Aufwand mit einem anderen Backend verwenden lassen.
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.046
204
63
18
Ich verwende Firebase bevorzugt im Entwicklungsprozess, weil es eine unkomplizierte API bietet und konfiguriere meine Services so, dass diese sich mit wenig Aufwand mit einem anderen Backend verwenden lassen.
Na dann gebe ich auch mein Okay :wink:

Websockets wären schon eine Alternative, erfordern allerdings einen NodeJS Server.
o_O bitte was? Korrigiere mich wenn, wenn ich hier irgendwas falsch verstanden habe, aber NodeJS als Web-Server ist doch nicht erforderlich. Mit dem LAMP- oder LEMP-Stack ist eine Implementierung von Websockets auch ohne NodeJS mittlerweile (verhältnismäßig) einfach zu erledigen. Ist Ratchet nicht eine PHP library, die Websockets für die (bidirektionale) Kommunikation benutzt? Übersehe ich hier was?
 
Zuletzt bearbeitet:
Werbung: