Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Smalltalk
Antworten
Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 12.04.2021 09:15:37

Hallo.

Wie ich schon im Thema geschrieben habe soll ein array aller 10 sekunden wieder aus einer datei neu eingelesen werden um es dann auszugeben. Mit

Code: Alles auswählen

<script src="Daten/JsDaten.js"></script>
funktioniert es ja scheinbar nicht. Das array sieht folgendermaßen aus

Code: Alles auswählen

var Wechselrichterwerte = ["89\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","310\n","34\n","10\n","1\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","-4\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","336\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n","weitere Zeile\n"
und wird dann mit folgender funktion verarbeitet

Code: Alles auswählen

function ausgeben() {
  var x = Wechselrichterwerte[0];
  var ausgabe = document.getElementById('ausgabe');
  ausgabe.innerHTML = x;
}


setInterval(ausgeben, 5000);

Das Array wird aller 10 sekunden in der Datei JsDaten.ja aktualisiert, wie kann ich die aktuellen daten übernehmen ?

Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 12.04.2021 09:44:58

So kannst du das nicht lösen - die .js-Datei wird genau einmal vom Server geladen. Was du brauchst, ist ein (wiederholter) Request im Javascript ("AJAX").

Code: Alles auswählen

setInterval(function() {
fetch(
    '/data.json',
    { method: 'GET' }
  )
  .then( response => response.json() )
  .then( json => ausgeben(json) ) // kleine Freiheit meinerseits: schreibs nicht in ne globale Variable, sondern übergib die Daten als Parameter
}, 5000);
kurz und ungetestet, so sieht das dann aber aus: fetch (modernste API für den Zweck) holt die Daten und gibt die Resultate verkettet mit .then(fn) weiter.
Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 12.04.2021 10:23:12

bei fetch ist noch irgendwie ein fehler, weiß aber jetzt auf die schnelle nicht warum

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 12.04.2021 11:13:33

mit xmlhttprequest müßte das doch auch gehen

Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 12.04.2021 12:22:25

Klar, natürlich.
Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 13.04.2021 08:31:40

Soweit läuft die aktualisierung schon mal aber irgendwie muss ich doch das array an Wechselrichterwerte übergeben weis aber nicht wie ich das anstellen soll. das das array mit var verarbeitetwerden kann

Code: Alles auswählen

<script>



function ausgeben() {
  var x = Wechselrichterwerte[0];
  var ausgabe = document.getElementById('ausgabe');
  ausgabe.innerHTML = x;
}


setInterval(function() {
fetch(
    'Daten/data.json',
    { method: 'GET' }
  )
  .then( response => response.json() )
  .then( json => ausgeben(json) ) // kleine Freiheit meinerseits: schreibs nicht in ne globale Variable, sondern übergib die Daten als Parameter
}, 5000);


setInterval(ausgeben, 5000); 

</script>


Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 13.04.2021 09:11:38

Saebelzahltieger hat geschrieben: ↑ zum Beitrag ↑
13.04.2021 08:31:40
Soweit läuft die aktualisierung schon mal aber irgendwie muss ich doch das array an Wechselrichterwerte übergeben weis aber nicht wie ich das anstellen soll. das das array mit var verarbeitetwerden kann
Du musst natürlich noch den Parameter in der ausgeben() Funktion ergänzen. Die globale Variable Wechselrichterwerte brauchst du nicht mehr, ebenso das zweite setInterval.

Code: Alles auswählen

<script>
function ausgeben(data) {
  var ausgabe = document.getElementById('ausgabe');
  ausgabe.innerHTML = data[0];
}


setInterval(function() {
fetch(
    'Daten/data.json',
    { method: 'GET' }
  )
  .then( response => response.json() )
  .then( json => ausgeben(json) )
}, 5000);
</script>

Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 13.04.2021 09:22:07

ja danke, ich sah den Wald vor lauter Bäumen nicht. Es funktioniert.

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 14.04.2021 06:42:11

Eine Frage habe ich noch und zwar will ich habhänig von den werten unterschiedliche div container ausgeben auch über id jedoch hat mein div ja schon eine css id

Code: Alles auswählen

<div id="Wechselrichter-Solarplatten-Linie-gerade-css">
. muss ich das dann im div tag über die stley anweisung lösen oder kann ich das eleganter lösen ?

Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 14.04.2021 09:42:11

Saebelzahltieger hat geschrieben: ↑ zum Beitrag ↑
14.04.2021 06:42:11
stley
style? Anweisung?
Saebelzahltieger hat geschrieben: ↑ zum Beitrag ↑
14.04.2021 06:42:11
habhänig von den werten unterschiedliche div container ausgeben
Das müsstest du etwas ausführen. So weiß ich nicht, ob vorplatzierte Container oder was anderes sinnvoller wäre.
Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 14.04.2021 12:34:32

Ich habe es so gelöst das ich beim div id andere bezeichnungen vergebe als beim css, funktioniert wunderbar. ich brauche nur noch eine funktion die wenn eine zahl 4 stellen hat einen punkt nach der ersten stelle einfügt, eine funktion die negative zahlen in positeve umwandelt und zur Zeit benutze ich parseInt um strings in Zahlen umzuwandeln, gibt es da eine modernere funktion ?

Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 14.04.2021 12:46:47

Saebelzahltieger hat geschrieben: ↑ zum Beitrag ↑
14.04.2021 12:34:32
ich brauche nur noch eine funktion die wenn eine zahl 4 stellen hat einen punkt nach der ersten stelle einfügt,
https://developer.mozilla.org/en-US/doc ... caleString

in nem Browser mit deutscher locale fügt das Tausenderpunkte ein.
Saebelzahltieger hat geschrieben: ↑ zum Beitrag ↑
14.04.2021 12:34:32
eine funktion die negative zahlen in positeve umwandelt
https://developer.mozilla.org/en-US/doc ... s/Math/abs
Saebelzahltieger hat geschrieben: ↑ zum Beitrag ↑
14.04.2021 12:34:32
Zeit benutze ich parseInt um strings in Zahlen umzuwandeln, gibt es da eine modernere funktion ?
https://developer.mozilla.org/en-US/doc ... s/parseInt

Da steht nichts von deprecation, ich wüsste auch nicht, wieso - das passt so.
Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 24.04.2021 10:24:30

Ich habe noch ein kleines Problem und zwar soll gewartet werden bis die holen.php ausgeführt wurde und dann soll die json datei erst eingelesen werden.

Code: Alles auswählen

function holedaten() {
fetch(
   'holen.php',
   { method: 'GET'}); 
fetch(
    'Daten/data.json',
    { method: 'GET' }
  )
  .then( response => response.json() )
  .then( json => ausgeben(json) )
};

setInterval(holedaten,3000);

Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 24.04.2021 10:27:06

Naja, du hast ja nun das Konstrukt, um Dinge miteinander zu verketten. Das musst du nur noch anwenden (was du da hast, startet es nur minimal versetzt gleichzeitig).
Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 24.04.2021 10:31:42

habs mal geändert, denke das ich richtig

Code: Alles auswählen

function holedaten() {
fetch(
   'holen.php',
   { method: 'GET'}).then 
fetch(
    'Daten/data.json',
    { method: 'GET' }
  )
  .then( response => response.json() )
  .then( json => ausgeben(json) )
};

setInterval(holedaten,3000);

Benutzeravatar
TRex
Moderator
Beiträge: 8038
Registriert: 23.11.2006 12:23:54
Lizenz eigener Beiträge: MIT Lizenz
Wohnort: KA

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von TRex » 24.04.2021 12:03:22

Der Syntax ist

fetch(...).then(fn)

wobei fn die Funktion ist, die du danach ausführen möchtest (mit dem Ergebnis des letzten Verkettungsschritts als Parameter).

Was du geschrieben hast:

fetch(...).then
fn

Ich greif dir nochmal unter die Arme:

Code: Alles auswählen

function holedaten() {
fetch(
   'holen.php',
   { method: 'GET'}).then(foo => {
    fetch(
        'Daten/data.json',
        { method: 'GET' }
      )
      .then( response => response.json() )
      .then( json => ausgeben(json) )
    )
};

setInterval(holedaten,3000);
Du siehst den Unterschied? Dass then ein Funktionsaufruf ist und runde Klammern mit Parametern drin erwartet?

Weitere Details: foo ist das Antwort auf holen.php, die interessiert uns inhaltlich aber nicht (zumindest siehts für mich bisher so aus). Weil wir hier mehrere Zeilen haben, muss man den Funktionskörper in geschweifte Klammern packen.
Jesus saves. Buddha does incremental backups.
Windows ist doof, Linux funktioniert nichtDon't break debian!Wie man widerspricht

Benutzeravatar
Saebelzahltieger
Beiträge: 171
Registriert: 10.02.2011 10:27:25

Re: Javascript Array soll aller 10 sekunden immer neu eingelesen werden

Beitrag von Saebelzahltieger » 24.04.2021 12:18:26

Dankeschön, ich hatte schon mit was ähnlichen probiert der brachte mir immer syntax error, hetzt geht es. es fehlte noch eine }

Code: Alles auswählen

function holedaten() {
fetch(
   'holen.php',
   { method: 'GET'}).then(foo => {
    fetch(
        'Daten/data.json',
        { method: 'GET' }
      )
      .then( response => response.json() )
      .then( json => ausgeben(json) )
    })
};

setInterval(holedaten,3000);

Antworten