Erstellung eines Skriptes das Daten aus Openweathermap liest und in ein HTML auf einem NAS Schreibt

Question

ViceLord

Erstellung eines Skriptes das Daten aus Openweathermap liest und in ein HTML auf einem NAS Schreibt

Hallo Leute,

sorry, für meine vielen Fragen die noch kommen werden, aber ich habe Urlaub und beschäftige mich gerade mit den Möglichkeiten des Scriptings vom AM. Leider habe ich keine Ahnung von JavaScript und bastel mir daher alles irgendwie zusammen. Klappt soweit ganz gut. Leider bin ich aber für die einfachen Sachen scheinbar zu blöd.

Im Skript unten lesen ich Daten von Openweathermap aus und gebe diese auf die Console. Das klappt einwandfrei.
Dann schreibe ich eine index.html auf ein Share auf meinem NAS (QNAP) mit aktiven Webserver. Das klappt auch einwandfrei. Die Datei kommt an.
Auf einer Seite im Neo Creator binde ich mir die Webseite ein. Das klappt auch. Ausgabe "hier kommt die Maus" wird angezeigt. Also wird eine index.html auf dem NAS geschrieben.

Was nicht klappt ist, dass ich die Variable content befülle. Zeile hab ich markiert mit ----> .... <----

Ist eine Variable, die ich oben definiert habe nicht autmatisch als global definiert? wie muss ich das machen, damit ich nach dem Durchlaufen von response die Variable content richtig befüllt habe?

Die Tags der HTML Struktur musste ich ändern und das "<" am Anfang rausnehmen, da diese sonst hier nicht korrekt angezeigt werden. Also im Skript sind diese dann wie bspw. beim body> korrekt mit führendem "<"

const https = require('https');
const fs = require('fs')

const url = 'https://api.openweathermap.org/data/2.5/onecall?lat=51.235528&lon=9.573041&exc
lude=minutly,hourly,alerts&units=metric&lang=de&appid=xxxxxxxxxxxxxx';
const path = "//xxx.xxx.xxx.xxx/Web/index.html";

var content = '';
content = content + '!doctype html>';
content = content + 'html>';
content = content + '  head>';
content = content + '    title>Wetterdaten von Openweathermap/title>';
content = content + '  /head>';
content = content + '  body>';

const request = https.request(url, (response) => {
    let data = '';
    
    response.on('data', (chunk) => {
            data = data + chunk.toString(); 
        });
  
    response.on('end', () => {
        console.log('GLOBAL----------------------------------------------------------')
;
        const global = JSON.parse(data);
---->        content = content + 'h1>' + global.timezone + '/h1>'; <----
        console.log(global.timezone);
        console.log(global.timezone_offset / (60 * 60)); // output timezone offset in hours
        let timezone_offset = 0;
        timezone_offset = global.timezone_offset * 1000;  // convert timezone offset to millis

        console.log('CURRENT---------------------------------------------------------')
;
        const current = JSON.parse(data).current;
        console.log(new Date(current.dt * 1000 + timezone_offset));
        console.log(new Date(current.sunrise * 1000 + timezone_offset));
        console.log(new Date(current.sunset * 1000 + timezone_offset));
        console.log(current.temp);
        console.log(current.pressure);
        console.log(current.humidity);
        console.log(current.uvi);
        console.log(current.clouds);
        console.log(current.visibility);
        console.log(current.wind_speed);
        console.log(current.wind_deg);
        console.log(current.sunrise);
        console.log(current.sunset);
        console.log(current.feels_like);

        console.log('WEATHER---------------------------------------------------------')
;
        const weather = JSON.parse(data).current.weather[0];
        console.log(weather.main);
        console.log(weather.description);
        console.log(weather.icon);

        console.log('DAILY TODAY-----------------------------------------------------');
        const today = JSON.parse(data).daily[0];
        console.log(new Date(today.dt * 1000 + timezone_offset));
        console.log(new Date(today.sunrise * 1000 + timezone_offset));
        console.log(new Date(today.sunset * 1000 + timezone_offset));
        console.log(new Date(today.moonrise * 1000 + timezone_offset));
        console.log(new Date(today.moonset * 1000 + timezone_offset));
        console.log(today.moon_phase);
        console.log(today.pressure);
        console.log(today.humidity);
        console.log(today.wind_speed);
        console.log(today.wind_deg);
        console.log(today.clouds);
        console.log(today.pop);
        console.log(today.rain);
        console.log(today.uvi);

        
        console.log('DAILY TODAY TEMP------------------------------------------------');
        const todaytemp = JSON.parse(data).daily[0].temp;
        console.log(todaytemp.min);
        console.log(todaytemp.max);
        console.log(todaytemp.day);
        console.log(todaytemp.night);
        console.log(todaytemp.eve);
        console.log(todaytemp.morn);      
        
        console.log('DAILY TOMORROW--------------------------------------------------');
        const tomorrow = JSON.parse(data).daily[1];
        console.log(new Date(tomorrow.dt * 1000 + timezone_offset));
        console.log(new Date(tomorrow.sunrise * 1000 + timezone_offset));
        console.log(new Date(tomorrow.sunset * 1000 + timezone_offset));
        console.log(new Date(tomorrow.moonrise * 1000 + timezone_offset));
        console.log(new Date(tomorrow.moonset * 1000 + timezone_offset));
        console.log(tomorrow.moon_phase);
        console.log(tomorrow.pressure);
        console.log(tomorrow.humidity);
        console.log(tomorrow.wind_speed);
        console.log(tomorrow.wind_deg);
        console.log(tomorrow.clouds);
        console.log(tomorrow.pop);
        console.log(tomorrow.rain);
        console.log(tomorrow.uvi);
        
        console.log('DAILY TOMORROW TEMP---------------------------------------------');
        const tomorrowtemp = JSON.parse(data).daily[1].temp;
        console.log(tomorrowtemp.min);
        console.log(tomorrowtemp.max);
        console.log(tomorrowtemp.day);
        console.log(tomorrowtemp.night);
        console.log(tomorrowtemp.eve);
        console.log(tomorrowtemp.morn);
        
        console.log('DAILY DAY AFTER TOMORROW----------------------------------------');
        const dayaftertomorrow = JSON.parse(data).daily[2];
        console.log(new Date(dayaftertomorrow.dt * 1000 + timezone_offset));
        console.log(new Date(dayaftertomorrow.sunrise * 1000 + timezone_offset));
        console.log(new Date(dayaftertomorrow.sunset * 1000 + timezone_offset));
        console.log(new Date(dayaftertomorrow.moonrise * 1000 + timezone_offset));
        console.log(new Date(dayaftertomorrow.moonset * 1000 + timezone_offset));
        console.log(dayaftertomorrow.moon_phase);
        console.log(dayaftertomorrow.pressure);
        console.log(dayaftertomorrow.humidity);
        console.log(dayaftertomorrow.wind_speed);
        console.log(dayaftertomorrow.wind_deg);
        console.log(dayaftertomorrow.clouds);
        console.log(dayaftertomorrow.pop);
        console.log(dayaftertomorrow.rain);
        console.log(dayaftertomorrow.uvi);
      
        console.log('DAILY DAY AFTER TOMORROW TEMP------------------------------------------------');
        const dayaftertomorrowtemp = JSON.parse(data).daily[2].temp;
        console.log(dayaftertomorrowtemp.min);
        console.log(dayaftertomorrowtemp.max);
        console.log(dayaftertomorrowtemp.day);
        console.log(dayaftertomorrowtemp.night);
        console.log(dayaftertomorrowtemp.eve);
        console.log(dayaftertomorrowtemp.morn);
    });
});
  
request.on('error', (error) => {
    console.log('An error', error);
});
  
request.end() 




content = content + '    h1>hier kommt die Maus/h1>';
content = content + '/body>';
content = content + '/html>';

fs.writeFile(path, content, err => {
  if (err) {
    console.error(err)
    return
  }
})

Status: Open Dez 16, 2021 - 14:37

NEO SERVER

Haben Sie die gleiche Frage? Dieser Frage folgen

Melden

2Antworten

Antworten

Fonzo

Dez 16, 2021 - 17:09

Ich gönne Dir ja Deine Erfahrungen, die Du beim Scripting im NEO Server sammelst, auch wenn Du sehr wahrscheinlich früher oder später feststellen wirst, dass Du schnell an die Grenzen kommen wirst, dessen was mit Skripten im NEO Server möglich ist.

Ich persönlich vertrete den Grundsatz ich muss mir nicht selber viel Arbeit machen und Zeit in etwas investieren, wenn es das an sich schon fertig als Lösung gibt. Wenn ich lese das Du da mit extra Webserver, HTML Seiten setzen und NAS rumhantiert, ist das schon nicht so einfach für den ersten Einstieg.

Vor allem musst Du Dich ja auch noch in HTML, CSS und Layout einarbeiten, wenn das Wissen zum Layout nicht schon vorhanden ist. Der große Vorteil von NEO Creator ist ja an sich, das man zum großen Teil vollkommen ohne HTML Kenntnisse auskommt. Da man jeden Datenpunkt eines Geräts frei auf der NEO Remote Seite platzieren und anpassen kann, ohne selber HTML nutzten zu müssen.

Daher nur als Hinweis es gibt auch die Möglichkeit vollkommen ohne selber Skripte zu schreiben Openweathermap mit allen Datenpunkten im NEO Creator zu nutzten.

Gerade wenn Du so oder so ein NAS betreibst kannst Du Dir überlegen ob Dir für alltägliche Dinge nicht auf dem NAS etwas installierst, das Dir solche Daten von sich aus für NEO als Gerät im Gerätemanager des NEO Creator zur Verfügung stellt. Das spart Dir dann nämlich das Layout setzten als HTML Seite, statt dessen kannst Du den NEO Creator so nutzten wie dieser gedacht ist, nämlich jeden einzelnen Datenpunkt auf der NEO Seite frei platzieren und anpassen. Ich nutzte für solche alltäglichen Dinge IP-Symcon und importiere solche Daten dann im NEO Creator im Gerätemanager. Das spart mir das Rad noch mal für einzelne Dinge neu zu erfinden und extra persönliche Zeit zu investieren. Außerdem hast Du an sich gerade bei Wetterdaten ja auch den Vorteil wenn Du diese dauerhaft aufzeichnest und dann in NEO auch als Graph anzeigst. Auch das wirst Du so alleine nicht mit einem einfachen Skript im NEO Server bewerkstelligen.

Die Zeit mit Skripten kannst Du ja dann in Dinge stecken, bei denen es wohl noch keine Lösung gibt wie z.B. Deine Anfrage zum Vestaboard.

Ansonsten würde ich an Deiner Stelle, wenn Du das wirklich als Skript nutzten willst, das in so weit anpassen, dass Du Dir für jeden Datenpunkt auch eine Variable per Hand im NEO Server anlegst und diese dann aus dem Skript beschreibst. Das spart Dir den Umweg über den NAS und außerdem brauchst Du dann auch kein HTML, sondern kannst statt dessen jede Variable einem Textfeld im NEO Creator zuweisen und anpassen.
Wenn Dir das mit einzelnen Variablen zu kompliziert ist, gibt es wie gesagt die Möglichkeit so was gleich als komplettes Gerät im NEO Creator von weiteren Systemen zu importieren.

0

Melden

Kommentare (5) | Neuer Kommentar

Von

ViceLord

auf 16.12.2021 18:04:54 | Gefällt mir (0) | Melden

Hi Fonzo,

IP Symcon fällt aus. Ich hatte mir mal die Trial installiert und bin nicht mit klar gekommen. Auch braucht es einen Rechner wo das drauf läuft, der permanent an ist. Mit den Lizenzkosten für IP Symcon, der Subscription, dem Plugin und dem Rechner ist mir das den Spaß nicht Wert.

Wenn ich das Ganze für dringende Sachen bräuchte, wär es eine Überlegung. Aber so eher nicht. Dann vielleicht eher ioBroker, da bräuchte ich lediglich den Rechner.beschaffen.

Das mit in Variablen schreiben wäre kein Problem. Ich komme aber nicht drumrum eine HTML Seite zu bauen, die mir die Grafiken anzeigt. Soll ja dann auch hübsch sein.

Die Überlegung auf dem NAS was laufen zu lassen ist natürlich auch nicht schlecht. Allerdings hab ich dann zwei Stellen mit Logik. Aber erst mal schauen, ob ich es mit dem AM hinbekomme.

Von

Fonzo

auf 16.12.2021 18:13:57 | Gefällt mir (0) | Melden

Die Grafiken könntest Du theoretisch auch im NEO Server abspeichern als Link oder als Base64 und dann in einem Webseitenelement anzeigen. Da brauchst Du dann kein HTML setzten bzw. auf dem NAS speichern, dann hast Du zumindest alles an einem Ort.
IP-Symcon läuft im übrigen auch in einem Docker auf einem NAS, insofern der NAS Docker unterstützt. Aber wenn Du damit nicht zurecht kommst, probiere vielleicht das mal mit Variablen im NEO Server, spart Dir das setzten als HTML.

Von

ViceLord

auf 16.12.2021 18:56:17 | Gefällt mir (0) | Melden

das wäre für mich eine Alternative, wie würden die beiden Varianten gehen. Wie bekomme ich die Grafik (Links) oder den Base64 String per Skript in ein Webseitenelement?

Von

Fonzo

auf 16.12.2021 19:37:43 | Gefällt mir (1) | Melden

Wie gesagt einfach den Link zur Grafik in eine String Variable auf dem NEO Server schreiben als Alternative die Grafiken selber als Base64 codiert in eine String Variable schreiben.
Dann nutzt Du ganz normal ein Element vom Typ Webseite fügst dort ein HTML Grundgerüst hinzu und weist die Variable des NEO Servers im variablen Anteil des img Tag zu.

Siehe auch img als Base 64
https://wiki.selfhtml.org/wiki/Grafik/Grafiken_mit_Data-URI

oder eben als Link
https://de.w3docs.com/html-lernen/html-bilder.html

HTML Grundgerüst eines NEO Webseitenelements %neo_state% ist die zugewiesene NEO Server Variable
https://doku.mediola.com/doku.php?id=de:creator:ui-remote-website

Von

ViceLord

auf 16.12.2021 20:16:40 | Gefällt mir (0) | Melden

Hi Fonzo,

habs ausprobiert. Klappt super mit dem Link im HTML Gerüst. Die anderen Sachen schreibe ich mir dann in Variablen und passe das dann via Text und Buttons etc. an.

Vielen Dank für den Hinweis mit dem %neo_state%, das kannte ich noch nicht. Eigentlich ganz easy.

Gruß Michael

Neuen Kommentar hinzufügen

ViceLord

Dez 17, 2021 - 14:13

Ich habe jetzt eine Combo aus HTML, Javascript und Webseitenelement gebaut. Angereichert mit Standardicons und Textelementen aus dem Neo Creator. Als Vorlage habe ich im Internet eine schöne Seite gefunden und diese entsprechend angepasst.

Sieht jetzt so aus

0

Melden

Kommentare (0) | Neuer Kommentar

Hi Fonzo,

IP Symcon fällt aus. Ich hatte mir mal die Trial installiert und bin nicht mit klar gekommen. Auch braucht es einen Rechner wo das drauf läuft, der permanent an ist. Mit den Lizenzkosten für IP Symcon, der Subscription, dem Plugin und dem Rechner ist mir das den Spaß nicht Wert.

Wenn ich das Ganze für dringende Sachen bräuchte, wär es eine Überlegung. Aber so eher nicht. Dann vielleicht eher ioBroker, da bräuchte ich lediglich den Rechner.beschaffen.

Das mit in Variablen schreiben wäre kein Problem. Ich komme aber nicht drumrum eine HTML Seite zu bauen, die mir die Grafiken anzeigt. Soll ja dann auch hübsch sein.

Die Überlegung auf dem NAS was laufen zu lassen ist natürlich auch nicht schlecht. Allerdings hab ich dann zwei Stellen mit Logik. Aber erst mal schauen, ob ich es mit dem AM hinbekomme.
Die Grafiken könntest Du theoretisch auch im NEO Server abspeichern als Link oder als Base64 und dann in einem Webseitenelement anzeigen. Da brauchst Du dann kein HTML setzten bzw. auf dem NAS speichern, dann hast Du zumindest alles an einem Ort.
IP-Symcon läuft im übrigen auch in einem Docker auf einem NAS, insofern der NAS Docker unterstützt. Aber wenn Du damit nicht zurecht kommst, probiere vielleicht das mal mit Variablen im NEO Server, spart Dir das setzten als HTML.
das wäre für mich eine Alternative, wie würden die beiden Varianten gehen. Wie bekomme ich die Grafik (Links) oder den Base64 String per Skript in ein Webseitenelement?
Wie gesagt einfach den Link zur Grafik in eine String Variable auf dem NEO Server schreiben als Alternative die Grafiken selber als Base64 codiert in eine String Variable schreiben.
Dann nutzt Du ganz normal ein Element vom Typ Webseite fügst dort ein HTML Grundgerüst hinzu und weist die Variable des NEO Servers im variablen Anteil des img Tag zu.

Siehe auch img als Base 64
https://wiki.selfhtml.org/wiki/Grafik/Grafiken_mit_Data-URI

oder eben als Link
https://de.w3docs.com/html-lernen/html-bilder.html

HTML Grundgerüst eines NEO Webseitenelements %neo_state% ist die zugewiesene NEO Server Variable
https://doku.mediola.com/doku.php?id=de:creator:ui-remote-website
Hi Fonzo,

habs ausprobiert. Klappt super mit dem Link im HTML Gerüst. Die anderen Sachen schreibe ich mir dann in Variablen und passe das dann via Text und Buttons etc. an.

Vielen Dank für den Hinweis mit dem %neo_state%, das kannte ich noch nicht. Eigentlich ganz easy.

Gruß Michael

Erstellung eines Skriptes das Daten aus Openweathermap liest und in ein HTML auf einem NAS Schreibt

2Antworten

Antworten

Thema durchsuchen

Kürzlich aktive Mitglieder

Werkzeuge