[GELOEST] Der letzte Befehl

[colaholiker]

Guten Tag,

mein Projekt, aus der Ferne die SD-Karte eines Microprozessors zu bearbeiten, ist eigentlich fertig.
Ich benutze Webseiten, die der Prozessor mit C++ direkt aufbaut.
Von dieesen Seiten, mit dem Button 'Home', gelange ich auf eine andere Gruppe von Webseiten, die sich auf dieser SD-Karte befinden.

Damit lösche ich also die Webseite mit dem Home-Button mit all ihren Funktionen aus dem Browser.

Mit Klick auf "Home" möchte ich vorher noch eine Mitteilung an den Prozessor senden: das ist der "Letzte Befehl".

Dies erfolgt bei meiner Lösung per Fetch- Routine. Allerdings mußte ich eine Pause einbauen, damit das Senden noch erfolgen kann.
Im Codeteil dargestellt ist:
- der Sprung zur Fetchroutine "sendtoMC_dir",
- die Pause (1sec.),
- der Aufruf des "Home"-Links (auch mit js).

[js, aus: function handleFileName]
sendtoMC_dir(action, fileName);
var now = Date.now(), end = now + 1000; while (now < end) { now = Date.now(); }
sendLink(fn);

Also: das funktioniert. Ich wollte nur fragen, ob es was Besseres gibt als diese Methode mit der Pause.
-danke-

 

[jonas3344]

Du willst mit dem Warten (was man im übrigen auch mit setTimeout() machen könnte eine Race-Condition vermeiden.

Was du suchst sind Promises:

Promise - JavaScript | MDN

The Promise object represents the eventual completion (or failure) of an asynchronous operation and its resulting value.

developer.mozilla.org

Damit kannst du garantieren, dass Javascript den zweiten Befehl erst starten, nachdem der Erste erledigt ist.

 

[colaholiker]

Hallo jonas3344,
"promise" ist wohl was ich brauche. Aber seit gestern teste ich das und komme nicht zu einem Ergebnis. Das wird wohl an der Syntax oder der Logik meines Codes liegen:

sendtoMC_dir(action, fileName);   
const p = new Promise(sendtoMC_dir(action, fileName), (resolve) => {
    p.then ( resolve(sendLink(fn))); // when successful
});

In der ersten Zeile führe ich die Funktion aus, in der zweiten erstelle ich ein Promise- Object das auf diese Funktion reagieren soll.
Dann soll Aufgrund dessen der Link (Beenden der Webseite) aktiviert werden.
Da passiert aber nichts.

 

[jonas3344]

Sollte der Syntax falsch sein würde Dir das der Browser (Console) oder Deine IDE sagen.

Grundsätzlich sollte die Funktion sendtoMC_dir eine Promise zurückgeben, die du mit await abwartest, also:

await sendtoMC_dir(action, fileName));
sendLink(fn);

Dann innerhalb von sendtoMC_dir hast du:

function sendtoMC_dir(action, filename) {
  return new Promise((resolve) => {
  // Mach was du machen musst und rufe resolve() auf zum Schluss.
})
}

Behafte mich nicht auf den Syntax.

 

[colaholiker]

Ah, ich muß was in die Funktion "sendtoMC_dir" reintun. Das macht Sinn.

Warum die auskommentierte Zeile? Muß dort was drinstehen, wenn ich nichts weiter haben will als den Aufruf von "sendLink", der ja bereits im Code steht (s. Dein Beispiel 'erster Codeschnipsel')?

Beim testen ergab sich: der Code hängt und die Console meldet, daß 'await' nur in einer asyncronen Funktion möglich ist. Ich habs noch direkt in einen Eventlistener versetzt und es kam dieselbe Meldung.

Das teste ich morgen weiter. Erstmal danke für den Schublser!

ok, jetzt geht es besser!

Ich mußte eine neue, asyncrone Funktion erstellen:

[alter Code-Standort ruft die Funktion auf:]
the_End(action, fileName);

[neue Funktion:]
async function the_End (action, fileName) {
    await sendtoMC_dir(action, fileName);
    const fn = 'homepage';
    sendLink(fn);
}

Den zugehörigen Teil in der Fetch- Routine "sendtoMC_dir(action, fileName)" mußte ich ganz an deren Ende setzen:

if ( action === 'home' ) {
    return new Promise((resolve) => {\n";
        // Mach was du machen musst und rufe resolve() auf zum Schluss.
        console.log('============= a-Promise reagiert');\n";
    });
}

Die IF-Einschränkung darum, weil noch viele andere Fälle/Daten übertragen werden.

Obwohl ich in der Console meinen Text sehe, erfolgt aber kein Sprung zurück zur asyncronen Funktion; "sendLink(fn)" wird nicht ausgeführt.

Kann es sein, daß es an meiner Fetch- Routine liegt und diese "nicht fertig" wird, da ich für 'action' = 'home' keine Rückmeldung programmiert habe? (war bisher nicht nötig).

Wenn ich das aber nachhole, bekomme ich ja eigentlich eine Fertigmeldung und könnte die Verarbeiung über Promise sparen.

Sehe ich das richtig?

 

[jonas3344]

Wie im Kommentar steht, du musst resolve() aufrufen nachdem du dort drin alles erledigt hast, dann wird die Promise zurückgegeben.

 

[colaholiker]

Das verstehe ich eben nicht.

Dann bedeutet "return new Promise..." nicht, daß ich zurück zu/unter "await sendtoMC_dir(action, fileName);" gelange nachdem die Funktion "sendtoMC_dir(action, fileName);" aufgerufen ist?
Soll ich dann "sendLink" an die Stelle der Kommentars setzen?

// Mach was du machen musst und rufe resolve() auf zum Schluss.

Wie sieht das aus? Etwa: "resolve(sendLink(fn));"?

Was ich 'machen muß' ist eben nur "sendLink" auszuführen, nach "sendtoMC_dir".

 

[jonas3344]

Die Grundlagen kann ich Dir hier nicht beibringen.

Aber eine Promise ist ein Objekt, welches den Erfolg oder theoretisch auch den Misserfolg einer asynchronen Aktion beinhaltet. Soweit ich verstanden habe nutzt du in sendtoMC_dir ein fetch? Das ist asynchron.

das heisst die Funktion sendtoMC_dir returniert eine Promise. Innerhalb dieser Promise hast du ein fetch, wobei nachdem fetch abgeschlossen ist (also wohl innerhalb von .then()). Rufst du resolve() auf. Damit ist die Promise erfolgreich und die asnychrone Funktion welche mit await gewartet hat kann ihren Code fortsetzen.

 

[colaholiker]

Die Grundlagen kann ich Dir hier nicht beibringen.

Schon ok. Dein Link und etliche weitere zu Promise habe ich mir natürlich angesehen.
Verstehen ist leider was anderes :-(

Ich hatte nach meinem Posting #6 für die Fetchroutine einen Antworttext programmiert und diesen unter .this ausgewertet. Das funktioniert:

.then(txt => {
    if ( txt === 'return_home' ) {
        var fn = 'homepage';
        sendLink(fn);
    }
...

Ich wußte wie .this wirkt, hatte das aber bisher nicht genutzt.

Im Vergleich zu Promise sehe ich hier dieselbe Wirkungsweise, so wie Du es ja in #9 auch schreibst. Ich könnte sogar ein Reject "nachbauen" wenn ich wollte.

Sehe ich das also richtig, daß "Promise" dazu da ist, von einer syncronen Verarbeitung in eine asynchrone zu wechseln?
Naja, Du benutzt für die Vorgänge in der Fetchroutine ja dieselben Begriffe, daher ist meine Auslegung vielleicht nicht ganz passend.

Der Code läuft jedenfalls. Muß nochmal testen was passiert wenn 'txt' nicht ankommt. Es reicht, wenn nichts passiert und ich den Home-Button nochmal drücken kann.

 

[jonas3344]

.then, nicht .this.

Das ist ungefähr dasselbe wie das Konstrukt, dass ich Dir vorgeschlagen habe. Es wartet darauf, bis fetch abgeschlossen ist und die Antwort da ist und fährt dann mit dem fort, was du im .then hast. Wenn du etwas ausserhalb von .then hast führt es das sofort aus.

 

[colaholiker]

Hi jonas3344,

- das mit Fetch hätte mir selbst einfallen können, aber weil die Webseite mit allen Funktionen gelöscht wird, naja.

Jetzt läuft das Ganze jedenfalls wie gewünscht und ich kann mich dem nächsten Vorhaben zuwenden.
Vielen Dank!