jpeg mit html und buttons

Hadmut F. schrieb:

Nun möchte ich auf dieser seite einen button der eine andere url aufruft

Meinst du sowas damit?

• https://wiki.selfhtml.org/wiki/HTML/Elemente/button

Hadmut F. schrieb:

und zwar:

• mit einem page reload von "http://192.168.178.41/";
• ohne page reload und ohne wechsel auf "http://192.168.178.41/control";

So ganz werde ich daraus nicht schlau. Bei dem ersten musst du halt auch das so angeben wie du es erwartest und nicht noch Zeugs hintendran. Und der zweite Button soll sowas wie ein Fake-Button sein der nichts macht?

Kannst du per Javascript machen, oder du passt z.B. den Webserver an, dass der bei "http://192.168.178.41/control" zwar seine Aktion durchführt, aber ein "204 no content" zurückmeldet, dann bleibt der Browser auf der aktuellen Seite.

sowas? https://www.w3docs.com/snippets/html/how-to-redirect-a-web-page-in-html.html

Εrnst B. schrieb:

Kdu passt z.B. den Webserver an, dass der bei "http://192.168.178.41/control" zwar seine Aktion durchführt, aber ein "204 no content" zurückmeldet, dann bleibt der Browser auf der aktuellen Seite.

TY werde ich versuchen.

Das funktioniert ! httpd_resp_set_status(req, HTTPD_204);

👍👍👍

Jemand ahnung wie man das :81 in kurzform ohne IP macht?

1

  if (dostream)

2

    out += "<img src=\"http://192.168.178.41:81/stream\" />\n"; 

3

  else 

4

    out += "<img src=\"/capture\" />\n";  

5

  out += "<br><br>";

Was meinst Du mit "Kurzform"?

Wenn die Seite vom gleichen Server ausgeliefert wird, reicht "/stream".

Wenn die Seite von einem Server mit der gleichen IP-Adresse, aber einer anderen Portnummer ausgeliefert werden soll, dann ist das nicht der gleiche Server, und dann ist eine vollständige URL incl. Servername bzw. IP-Adresse nötig.

Das sind portnummer 80 für http und 81 für stream. Warum? K.A. Also muss ich den string mit sprintf(ip) basteln-

Habe das so gemacht:

1

String act_ip;

2

3

// in setup

4

act_ip = WiFi.localIP().toString().c_str();

5

6

// commandhandler

7

out += "<img src=\"http://" + act_ip + ":81/stream\">\n";

Ich hab ein gefährt dass sich über http steuern lässt.

Für vorwärts / stop geht das mit knöpfen gut, für links / rechts ist das aber zu grob quantisiert.

Wie könnte man das sonst noch auf einfache art flüssig steuern?

• Tastaturabfrage über browser?
• Mousepointer abfrage im browser?
• Slider?

Hadmut F. schrieb:

Wie könnte man das sonst noch auf einfache art flüssig steuern?

mit einer technologie, die dafür gemacht wurde?

Dr google sagt, dass das über http schon gehen kann, hier z.B. https://learn.sparkfun.com/tutorials/wifi-controlled-robot/all oder hier https://www.electronicshub.org/wifi-controlled-robot-esp8266-arduino/

vielleicht ist dein Problem ja nur, dass der Mechanismus, den du mit dem forwarding gebaut hast, etwas langsam ist. Kannst du eine website bauen, die nicht komplett neu geladen wird, sondern nur Teile aktualisiert, z.B. mittels javascript oder altmodisch mit iframes?

Dann kannst du alles mit höherer Wiederholrate ansteuern. Natürlich nur unter der Annahme, dass deine Robotersoftware effizient genug designt ist.

A. S. schrieb:

Kannst du eine website bauen, die nicht komplett neu geladen wird

Das ist mit dem "HTTPD_204" von Ernst B. bereits realisiert und funktioniert prächtig.

Wie das mit den slider geht weiss ich inzwischen auch. Läuft dank 204 auch ruckelfrei mit 15 fps bei 480x320.

https://learn.sparkfun.com/tutorials/wifi-controlled-robot/all

Ty. Das keyboard einfangen werde ich probieren.

Das läuft!

1

<script type="text/javascript">

2

document.addEventListener("keydown", function (evt) {

3

  if (evt.keyCode == "12") fetch("http://192.168.178.36/?S=");

4

});

5

</script>

Könnte man mit ajax eleganter machen aber das versteh ich nicht.

Die keyboard variante funktioniert ausserordentlich gut. Das lässt sich flüssig steuern, viel besser als die button variante.

Hab so gemacht dass er mit "up arrow" taste forwärts geht bis man die taste wieder loslässt. Mit "left arrow" dreht er auf platz links bis man loslässt. Und mit "up arrow" und "left arrow" gleichzeitig mach er eine linkskurve.

Bei "up arrow" und gleichzeitig "down arrow" bekommt er kognitive dissonanz und reagiert agressiv.

Das im bild ist mein 15kwh akku 😊

Hadmut F. schrieb:

Könnte man mit ajax eleganter machen aber das versteh ich nicht.

AJAX, also das Rumgehampel mit XMLHttpRequest und co, ist seit ca. 2016 nicht mehr Mittel der Wahl. Ab da haben alle Browser "fetch()" unterstützt, was wesentlich eleganter ist.

Wenn du irgendwo Tutorials & Beispielcode findest, der XMLHttpRequest verwendet, würde ich nach was Aktuellerem weitersuchen.

Ansonsten gäbe es die Option, die Inputs per Websocket zu übertragen, wäre nochmal eine Ecke schneller, weil jeweils der Verbindungsaufbau & HTTP-Header entfällt.

Übrigens: fetch nimmt auch relative URLs, fetch("/?S=") spart dir das Einsetzen der IP-Adresse im HTML.

Bei "up arrow" und gleichzeitig "down arrow" bekommt er kognitive dissonanz und reagiert agressiv.

Dein Keyboard-Handler schickt alle Tastendrücke raus, ohne zu warten bis die beim ESP angekommen & verarbeitet worden sind (d.H. es können viele HTTP-Requests gleichzeitig laufen)

Mach einfach mal nebenbei die Browser-Entwicklertoos auf, und schau in das Netzwerk-Tab

um die lokale IP zu benutzen habe ich so ein Snippet:

1

var ip = location.host;

2

var ws_Url = "ws://" + ip + "/ws/";

Da muss ja noch das Protokoll vorne dran, oder geht das auch einfacher?

Εrnst B. schrieb:

AJAX, also das Rumgehampel mit XMLHttpRequest und co, ist seit ca. 2016 nicht mehr Mittel der Wahl. Ab da haben alle Browser "fetch()"

TY

Übrigens: fetch nimmt auch relative URLs, fetch("/?S=") spart dir das Einsetzen der IP-Adresse im HTML.

TY

Dein Keyboard-Handler schickt alle Tastendrücke raus,

Ich hab (keydown && !repeat) und keyup drin. Der traffic ist minim.

1

  out += "document.addEventListener(\"keydown\", function (evt) {\n";

2

  out += "  if (evt.keyCode >= \"37\" && evt.keyCode <= \"40\" && !evt.repeat)"; 

3

  out += "    fetch(\"http://"+act_ip+"/?D=\"+evt.keyCode);\n";

ja, das mit fetch("/?S=") hab ich gesehen.

Hab das gesamte .zip angehängt.

J. S. schrieb:

um die lokale IP zu benutzen habe ich so ein Snippet:

1

var ip = location.host;

Ich hab

1

  String act_ip;

2

  act_ip = WiFi.localIP().toString().c_str();

3

  Serial.println(act_ip);

deins ist einfacher, TY.